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

您正在以順時針方式添加頂點。你應該逆時針添加它們。切換第一個和第三個頂點。這樣可以避免兩次繪製人臉的性能開銷。