How to map texture to gltf? (engine only)

Help & Support
1

HI,
I know about gltf file linked in texture like below… so it’s works well.

    "textures": [
        {
            "sampler": 0,
            "source": 0
        }
    ],
    "images": [
            {
                "uri": "DuckCM.png"
            }
        ],
    "samplers": [
         {
                    "magFilter": 9729,
                    "minFilter": 9986,
                    "wrapS": 10497,
                    "wrapT": 10497
                }
    ],

goood
But my gltf data converted from FBX has no key like ‘textures’, ‘image’
It’s has texture separately
so I just tried mapping like json model (make material including texture and set material to entity.material) like below

    let diffuseTexture = new Image();
    diffuseTexture.src = `${environment.apiUrl}/assets/products/gltf_test/diffuse.png`;

    diffuseTexture.onload = () => {
      let texture = new pc.Texture(this.app.graphicsDevice, {});
      texture.setSource(diffuseTexture);

      const material = new pc.StandardMaterial();
      material.diffuseMap = texture;
      material.update();

      wheel.children[0].model.meshInstances[0].material = material;
    };

but it’s look weird…
PNG
So to make sure my data is find,
I put the FBX on the editor and download JSON, and tried same process as above.
It’s works well …
PNG

I don’t know about texture mapping on gtlf by code
Please somebody give me a clue

Thanks.

  • or is it an FBX converter problem?
    Should texture be integrated in the converter ?
2

First time, I used facebook converter


Weird mapping with playcanvas-gltf.js

Second time, I used online converter,

When I used online converter, texture map to gltf works well !

--------------------------------update---------------------------
option with FBX2glTF “–no-flip-v” solved everything.

1 Like