Dynamically change Vertex Color in Three.js

Question

I am using Three.js 57 version. Now I am working in animation using JSONLoader. I got the animation successfully. But I want to update full vertex color of mesh for each frame in animation. Is this possibe in three.js

Thanks in Advance

Answer 1

Vertex colors are currently not supported in CanvasRenderer.

Here is the pattern you need to follow for WebGLRenderer:

Set THREE.VertexColors when you create the material for the mesh;

material.vertexColors = THREE.VertexColors;

Also make sure that vertexColors are defined for each face of your geometry.

geometry.faces[ faceIndex ].vertexColors[ vertexIndex ] = new THREE.Color( 0xff0000 );

Then in your render loop, to change a vertex color, do this:

geometry.faces[ faceIndex ].vertexColors[ vertexIndex ].setHSL( Math.random(), 0.5, 0.5 );
mesh.geometry.colorsNeedUpdate = true;

three.js r.59