Three.js 实时更新几何体的方法

基于性能的原因，改变几何体(Geometry)的某些属性不会引起浏览器对几何体(Geometry)的重新绘制。THREE.js会缓存一些

数据，例如几何体的顶点和面的信息，修改这些属性的时候需要通知THREE.js去更新几何体，这些几何体才能得到重新计算并更新。

需要通知THREE.js更新的几何体(Geometry)属性

下面这些属性的变动需要通知THREE.js更新

1. geometry.vertices

2. geometry.faces

3. geometry.morphTargets

4. geometry.faceVertexUvs

5. geometry.faces[i].normal and geometry.vertices[i].normal

6. geometry.faces[i].color and geometry.vertices[i].color

7. geometry.vertices[i].tangent

8. geometry.lineDistances

通知THREE.js更新

针对不同的属性变化，都可以设置该几何体实例的某个属性值为true来通知THREE.js重新计算这些几何体并更新，当THREE.js更新了这些几何体之后，这些属性值又会重新被设置为false。

//修改几何体各个面的颜色
this.changeColors = function () {
var mesh = scene.getObjectByName('cube');
mesh.geometry.faces.forEach(function (face) {
face.color.copy(new THREE.Color(Math.random() * 0xffffff));
});
};

//通过将几何体的colorsNeedUpdate的属性修改为true，来通知THREE.js该几何体的颜色发生变化。
var mesh = scene.getObjectByName('cube');
mesh.geometry.colorsNeedUpdate = true;

colorsNeedUpdate ： geometry.faces[i].color and geometry.vertices[i].color发生变化的时候设置为true

verticesNeedUpdate：geometry.vertices发生变化的时候设置为true

elementsNeedUpdate：geometry.faces发生变化的时候设置为true

morphTargetsNeedUpdate：geometry.morphTargets发生变化的时候设置为true

uvsNeedUpdate：geometry.faceVertexUvs发生变化的时候设置为true

normalsNeedUpdate：geometry.faces[i].normal and geometry.vertices[i].normal发生变化的时候设置true

tangentsNeedUpdate：geometry.vertices[i].tangent发生变化的时候设置为true

needsUpdate：我们也可以动态的修改纹理和材质，材质发生改变的时候将material.needsUpdate设置为true来通知THREE.js重新进行计算绘制。

转至：http://blog.csdn.net/yangnianbing110/article/details/51318884