The geometry
I have a cube represented as a triangular mesh:
Applying a color
Each of the vertices gets a color assigned, to apply a color map onto the cube.
In GLTF format, the mesh is therefore described as follows:
{
"primitives": [
{
"attributes": {
"POSITION": 0,
"COLOR_0": 2
},
"indices": 1
}
]
}
Problem: Ugly rendering
Unfortunately, this is rendered with ugly artifacts. The color of the three vertices of a face are not smoothly interpolated across the face, but there are brighter and darker zones along the edges of the triangles. This happens with various renderers such as Babylon.js, Cesium, Filament, Three.js.
What's the reason for those artifacts and how can I get a smooth colormap on my cube?

