Three.js设置脸部颜色

Question

我想设置脸部的颜色但失败。如果我使用wireframe，结果似乎是正确的。但是，如果不是，脸部似乎不会呈现。

var geo = new THREE.Geometry(); 
geo.vertices.push(new THREE.Vector3(1, 1, 0)); 
geo.vertices.push(new THREE.Vector3(1, 0, 0)); 
geo.vertices.push(new THREE.Vector3(0, 0, 0)); 
geo.faces.push(new THREE.Face3(0, 1, 2)); 
geo.faces[0].color = new THREE.Color('rgb(0,255,0)'); 
var mesh = new THREE.Mesh(geo, new THREE.MeshBasicMaterial({ 
    vertexColors: THREE.FaceColors, 
    color: 0xff0000//, 
    //wireframe: true 
})); 
scene.add(mesh); 

这里的演示：http://jsfiddle.net/yaxpberz/。

Answer 1

事实证明，根据添加到人脸时的顶点顺序，相机正在观察网格的背面。所以，它可以通过以下方式解决：

var mesh = new THREE.Mesh(geo, new THREE.MeshBasicMaterial({ 
    vertexColors: THREE.VertexColors, 
    color: 0xff0000, 
    side: THREE.BackSide 
})); 

Answer 2

您正在以顺时针方式添加顶点。你应该逆时针添加它们。切换第一个和第三个顶点。这样可以避免两次绘制人脸的性能开销。