How to add texture to glb model exported without a texture?

What I would like to do is export a 3d model without texture ( from 3d software ) and add the texture to the mesh’s material in threejs. The reason is that exported model without texture and with empty material is 4kb, with the texture it is 100kbs. This texture is shared for several different meshes, so it’s pretty major optimization to load the models without textures and then use the same texture for multiple models.

The problem is that when I load the model that does not have texture included I can’t get it to use the texture. this does not work, if the model did not come with the texture already:

const grassMat = new THREE.MeshStandardMaterial({
map: plantsTexture,
color: ‘white’,
roughness: 1.0,
metalness: 0,
side: THREE.DoubleSide,
needsUpdate: true

When the exported model had texture, I can load any kind of texture on it. So I don’t know how to apply a texture to a model that comes without it’s own texture.

Have a look at this example:
See the difference in behaviour, when you do and when you don’t set .needsUpdate = true; of a material.

When you instantiate a material without .map, shaders compile without some respective defines for maps.
And when you set .map after that, all you need is to tell the renderer to re-compile material’s shaders.

Hope it helps.

1 Like

Thanks, I had a look at the example, but the behaviour is different on imported models. On basic geometry loading texture is fine.

When I import 3d model and even set the material to needsUpdate: true, it is black. The only way I can have textures on models is when the 3d model already had a texture on it when exported, which is what I want to evade. Do you have by any chance example how to load texture on imported 3d model, which was imported without a texture?

Does your model’s geometry have uv attribute?
Does your model’s geometry have normal attribute?
Does your model’s material color set to white? As colors has channel-wise multiplication and if your material’s color is black, then whateve colors your map has, there’s always will be black.
Doest your scene have light sources?

1 Like

I am exporting the same model from 3d software. This models has uvs etc. The only difference is that one time I export with material that has a texture and second time with material without a texture.
When I import in threejs model which had texture applied I can set any kind of texture to that model in threejs and it all works fine. If I import the exact same model that had not texture applied, I can’t set any texture to it. The texture is not appearing.

I just took a random model, that has parts with and without texture

and applied a texture (with flipY = true) to the model this way:

  model.traverse(child => {
    if (child.isMesh){ = texture;
      child.material.needsUpdate = true;

So I got this:

It doesn’t work without child.material.needsUpdate = true;
As you can see, parts that had no texture (and had no uvs), became red-dish, as their color multiplied with red, which is at [0, 0] uv (by default, I think) for the texture.

Yes, you are actually correct on what is happening. The color is now corresponding to top left pixel in the texture, ie just like in your case to red color. But the model has uvs, I double checked in 3ds max. Is there any reason why threejs would not be importing the uvs?

I would log the model from loader’s callback function into browser’s console, and check, if its (the model’s) geometry has uv attribute.

There’s also a chance, that your 3D-software doesn’t export UVs, if no texture applied. :thinking:

Not sure, if this is correct attribute, but it looks it has an uvs attribute.

Any chance to provide here an editable live code example with this model?
codepen, codesandbox etc.
Not specifically for me, but also for those, who would like to participate )

Sorry, my mistake, I logged it for second model which I was testing with the exported texture. The model does not have uvs, so you were right. Unless I export 3d model as gltf from 3ds max with texture, it will drop the uvs for whatever reason ( this is not behaviour with fbx for example I am used to ). So it’s a 3ds max issue exporting gltf that has uvs, but is exported without uvs unless there is texture applied.
Thanks for your help, would not figure this out. I will see what’s the problem with 3ds max.

1 Like