How to properly assign diffuse texture in an imported mesh

Hi guys it’s taking me some time to figure this thing out but I know it is simple.maybe ? I made my 3d in blender export it as a glb file import it in my babylonjs project I did some smart uv or simple uv and did many textures but every time I assign the diffuse texture to the texture that I made in blender it wont place the texture properly in my project. here’s what I did.

const TheTreaz = await this.importMesh(scene, “./models/”, “treasure.glb”)
TheTreaz.meshes[1].parent = null
// TheTreaz.meshes[0].dispose()
treasure = TheTreaz.meshes[1]
treasure.position = new Vector3(7,0,0)
treasure.rotationQuaternion = null

    const mat = new StandardMaterial("treasureMat")
    const myTreasureTex = new Texture(`./images/modeltex/treasure${0}.jpg`, scene)
    mat.diffuseTexture = myTreasureTex
    treasure.material = mat
    TheTreaz.meshes[0].material = mat

everything wont work maybe some of you already encounter this problem. my goal here is to assign different texture in my treasure mesh. so I will make 3 textures(old looking, new looking and a gold looking textures


Can’t really tell just looking at the pictures, have you tried setting the texture invertY = true ?

You could try to repro the issue with a more obvious case, such as a cube with text drawn on each colored face, it will give you more information about what happens.

1 Like

On spheres and boxes assigning diffuse Textures has no problems at all, I tried updating my babylon js packages but still result are same. I did unwrap my 3d model in blender and then did some texture painting again. saved the texture and then export the unwrapped 3d model again in babylon and assign the texture on the 3d model but still It doesn’t fit correctly. I can make a playground out of this but I have no use of basics shapes. hmmm Is there any uv or texture options for this ?I tried inverting the texture but it is still the same

Assuming this (in magenta) is what Blender SmartUV unwrapped as the lid

Flipping your texture along the Y Axis gives this

We notice the magenta zone looks a lot like what you have in your scene.

Which is why I’m 90% sure that adding this line will solve the issue (unless it’s what you’ve already tried “inverting the texture” ?)

mat.diffuseTexture.invertY = !mat.diffuseTexture.invertY

The idea of using simple shapes and debug texture is that it helps troubleshooting what goes wrong in the export pipeline.
It doesn’t mean using BabylonJS built-in primitives (nor replacing your models with primitives in your project ^^), because they don’t have UV mapping issues. It means to draw / export / import a simple model and a simple debug texture the same way you do with the chest, so you can notice more easily what happens.

Good luck ! Uvs never work the first time :slight_smile:

1 Like

Sven thank you so much, I think it’s the inverting I really feel like it is simple. I figured it out and It’s just on my code so normally I set a texture like this: new Texture(“url”, scene) but when I tried mat.diffuseTexture = new Texture(./images/modeltex/treasure${rarity}.jpg, scene, false, false) I put false false on the 3rd and 4th parameter then it works. I don’t know why maybe because the 4th parameter is by default true ? the invert thing. Thankfully it works now. thanks for helping me out ! I really appreciate it.

1 Like