立方体
随意颜色的生成可以使用Math.random()函数：0xFFFFFF*Math.random()。
也可以使用color.fromArray(colorArray)的方式。RGB数据来源于一个float32位的数组。
最后设置旋转一定角度之后就变换一种颜色，产生一个动态效果。
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(45,window.innerWidth/window.innerHeight,0.1,1000);
camera.position.set(-20,20,20);
camera.lookAt(scene.position);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth,window.innerHeight);
renderer.setClearColor(new THREE.Color(0xCCCCCC));
var cubeGeometry = new THREE.BoxGeometry(8,8,8);
var color = new THREE.Color(0xFF0000);
var colorArray = new Float32Array([Math.random(),Math.random(),Math.random()]);
var cubeMaterial = new THREE.MeshLambertMaterial({
//color:color.fromArray(colorArray)
color:0xFFFFFF*Math.random()
})
var cube = new THREE.Mesh(cubeGeometry,cubeMaterial);
cube.position.set(0,0,0);
scene.add(cube);
var ambientLight = new THREE.AmbientLight(0x222222);
scene.add(ambientLight);
var pointLight = new THREE.PointLight(0xFFFFFF);
pointLight.position.set(-20,40,30);
scene.add(pointLight);
document.body.appendChild(renderer.domElement);
renderer.render(scene,camera);
var ts = 0;
function render() {
cube.rotation.y += 0.01;
ts ++;//旋转一定的角度后再改变颜色
if(ts == 100){
var colorArray = new Float32Array([Math.random(),Math.random(),Math.random()]);
cube.material.color.fromArray(colorArray);
ts = 0;
}
renderer.render(scene,camera);
requestAnimationFrame(render);
}
render();
GIF.gif
