[Solved] Material texture update after apply?

Sooo, I have the following snippet:

//--- create material
var shader_basic = new THREE.MeshBasicMaterial();
    shader_basic.color = new THREE.Color('cornflowerblue');
    shader_basic.skinning = true;

//--- load model & texture
var system_loader  = new THREE.JSONLoader();
var system_texture = new THREE.TextureLoader();

var character = undefined;

system_loader.load('./mushi_min.json', (geometry) => 
    {
    character = new THREE.SkinnedMesh(geometry,shader_basic);
    skeleton = new THREE.SkeletonHelper(character);

    system_scene.add(character);
    system_scene.add(skeleton);

    requestAnimationFrame(main_loop);
    }
    );

system_texture.load('texture.png', texture => 
    {
    shader_basic.map = texture;
    console.log("success");
    });

But the following happens:
If by any reason the texture gets loaded before the object by the browser then it shows up, if not then the material will be just a solid color.

What is the proper way to update a material after a mesh has been created with it?

Try this:

system_texture.load('texture.png', texture =>
    {
        shader_basic.map = texture;
        shader_basic.needsUpdate = true;
        console.log("success");
    });
1 Like