three.js - 在 Three.js 中动态改变顶点颜色

Question

我使用的是 Three.js 57 版本。现在我正在使用 JSONLoader 制作动画。我成功获得了动画。但我想为动画中的每一帧更新网格的完整顶点颜色。这可能在three.js中吗

提前致谢

Answer 1

CanvasRenderer 目前不支持顶点颜色。

以下是 WebGLRenderer 需要遵循的模式:

在为网格创建 Material 时设置THREE.VertexColors；

material.vertexColors = THREE.VertexColors;

还要确保为几何图形的每个面定义了 vertexColors。

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

然后在您的渲染循环中，要更改顶点颜色，请执行以下操作:

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

three.js r.59