Skip to content

How to add text on texture (from file). #1894

pabloj opened this Issue May 10, 2012 · 2 comments

2 participants

pabloj commented May 10, 2012


Is it possible to somehow use fillText() to place a text onto previously loaded texture?
I have a code like below:

function onStartClick( ) {
    if (changed == 0) {
        var material = new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'TexPudelko_Changed.jpg' ) } );            
            //  material.fillText();
    changed = 1;

It dynamically changes the texture of the object if user clicks on some div object.

But i would like to add a text on the defined position into this texture too.
Can I do that only with Three.JS and how if so?

Thanks for help.

mrdoob commented May 10, 2012

Just create a normal canvas and do this:

var texture = new THREE.Texture( canvas );
texture.needsUpdate = true;

var material = new THREE.MeshBasicMaterial( { map: texture } );

Then for modifying the canvas, do this:

texture.image.getContext('2d').fillText(); // or directly use a context reference if you already have it
texture.needsUpdate = true;
pabloj commented May 10, 2012

I already did it in similar way several minutes after my post. Thank you anyway :)

@mrdoob mrdoob closed this May 10, 2012
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.