Thay đổi màu của khuôn mặt khối lập phương

Question

Tôi thực sự tìm thấy câu hỏi this, nhưng nó cho biết material.color không tồn tại. Tôi cần phải biết làm thế nào để thay đổi màu sắc của những gương mặt khác nhau của một khối lập phương tôi đang vẽ:

var newCube = new THREE.Mesh(new three.CubeGeometry(size, size, size), new three.MeshNormalMaterial({ vertexColors: three.FaceColors })); 

Answer 1

Đây là cách bạn thiết lập và thay đổi màu sắc của khuôn mặt của một khối lập phương:

var geometry = new THREE.BoxGeometry(size, size, size); 
for (var i = 0; i < geometry.faces.length; i ++) { 
    geometry.faces[ i ].color.setHex(Math.random() * 0xffffff); 
} 

var material = new THREE.MeshBasicMaterial({ color: 0xffffff, vertexColors: THREE.FaceColors }); 

Nếu geometry.faces[i].color được thay đổi sau khi hình đã được hiển thị, bạn phải đặt geometry.colorsNeedUpdate = true. (Đây không phải là cần thiết cho canvasRenderer.)

three.js r.84

Answer 2

Đây is a fiddle cho những người kết thúc ở đây và muốn nhìn thấy mã này làm việc.

tôi đã thực hiện một hộp và gắn 3 màu sắc để khuôn mặt:

// colors 
red = new THREE.Color(1, 0, 0); 
green = new THREE.Color(0, 1, 0); 
blue = new THREE.Color(0, 0, 1); 
var colors = [red, green, blue]; 

for (var i = 0; i < 3; i++) { 
    geometry.faces[4 * i].color = colors[i]; 
    geometry.faces[4 * i + 1].color = colors[i]; 
    geometry.faces[4 * i + 2].color = colors[i]; 
    geometry.faces[4 * i + 3].color = colors[i]; 
} 

Những màu sắc khuôn mặt đang thay đổi trong animate vòng lặp.