How to use original colors for GLTF geometry

[BenjaminLecuona]

Hello community,

I would like to load a GLTF on a map using its orignal symbology.

Following this documentation (https://developers.arcgis.com/javascript/latest/visualization/3d-visualization/visualizing-points-3d...), I am able to convert a GLTF into a single geometry and add it to a map.

But the symology of the loaded geometry is not the same as the original.

Original (expected)	Loaded

What I do is to add the geometry without specifying any symbology. Maybe it is incorrect?

Mesh.createFromGLTF(location, "https://developers.arcgis.com/javascript/latest//sample-code/geometry-mesh-elevation/live/pine_tree.glb")
.then(function (geometry) {
    geometry.scale(1, { origin: location });
    geometry.rotate(-90, 0, 0);
    const graphic = new Graphic({geometry});
    view.graphics.add(graphic);
})
.catch(console.error);

As you can see in my sample code (https://codepen.io/blecuona/pen/ZEVxXxN), colors are automatically modified.

I am doing something wrong? Is there any solution to my problem?

Thanks for your help.

[Martin_B · Accepted solution]

Hello, Benjamin!

You are correct in that you would need to specify symbology when creating a geometry object.

This modification of your code provides the result you are looking for:

const graphic = new Graphic({
                          geometry,
                          symbol: {
                            type: "mesh-3d",
                            symbolLayers: [{
                              type: "fill",
                              material: {
                                colorMixMode: "tint"
                              }
                            }]
                          }});

Hope this helps! 🙂

[BenjaminLecuona]

I didn't saw your answer, so thank you it is perfect!

Specifiy material.colorMixMode is not necessary, default values are enough.