How to attach text to the vertices of a cube in three.js? Also, can I add text at any point inside the cube?

Question

I am trying to create a cube using three.js for a project. I need to add text to the vertices and to different points inside the cube. Any idea how this can be done?

Answer 1

For some basic examples of using Sprite objects in Three.js, check:

http://stemkoski.github.com/Three.js/Sprites.html

And for an easy way to create images containing text for use as sprite textures, check the sample code at:

http://stemkoski.github.com/Three.js/Texture-From-Canvas.html

I think that a combination of these two ideas will achieve what you want to do.

Answer 2

If you want to have texts in the style of labels, so that the text starts from a certain point, but is always camera-oriented and easy to read regardless of the position of the camera, you can use sprites. (example of sprite text labels created by the canvas: http://i.imgur.com/e9I68xD.jpg - here they are displayed in a separate passage so that they are never obscured by the scene but you can do it on the same passage)

If this is what you are looking for, I would suggest checking the Sprites examples first and learning how to attach some kind of static image as a sprite to fix the situation in the scene. After you get this work, you will change the code so that you generate text on the image canvas using the standard Javascript Canvas functions and using this image as a sprite.