colors - Cambio de color del cubo en three.js.
(3)
Estoy tratando de cambiar el color de un cubo basado en una variable. Creé dos cubos y quiero cambiar su color dependiendo de la distancia entre ellos.
Los cubos son creados así:
geometry = new THREE.CubeGeometry( 50, 50, 50 );
material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
cube = new THREE.Mesh( geometry, material );
scene.add( cube );
Ahora probé algo como esto:
if(distance > 20)
{
cube.material.color = 0xffffff;
}
Pero no funciona. Miré en los ejemplos pero no pude encontrar nada apropiado.
Mi sugerencia es adjuntar una función a su objeto y luego puede cambiar el color del objeto durante el tiempo de ejecución fácilmente.
Basado en tu codigo
geometry = new THREE.CubeGeometry( 50, 50, 50 );
material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
cube = new THREE.Mesh( geometry, material );
//here is the funcion defined and attached to the object
cube.setColor = function(color){
cube.material.color = new THREE.Color(color);
}
cube.setColor(0xFFFFFF) //change color using hex value or
cube.setColor("blue") //set material color by using color name
scene.add( cube );
No estás especificando el valor del color correctamente.
cube.material.color.setHex( 0xffffff );
cube.material.color
te dará el objeto THREE.Color:
que tiene un montón de métodos que puede utilizar para establecer el color.