javascript - tag - Cambiar los colores de las caras de un cubo
title html (2)
Aquí hay un violín para las personas que terminan aquí y quieren que este código funcione.
Hice una caja y até 3 colores a las caras:
// 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];
}
Los colores de la cara se cambian en el bucle animate
.
De hecho, encontré esta pregunta, pero dice material.color
no existe. Necesito saber cómo cambiar los colores de las distintas caras de un cubo que estoy dibujando:
var newCube = new THREE.Mesh(new three.CubeGeometry(size, size, size), new three.MeshNormalMaterial({ vertexColors: three.FaceColors }));
Aquí es cómo configura y cambia los colores de las caras de un cubo:
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 } );
Si geometry.faces[i].color
se cambia después de que se haya renderizado la geometría , debe establecer geometry.colorsNeedUpdate = true
. (Esto no es necesario para canvasRenderer
).
three.js r.84