Question

   // Load in the mesh and add it to the scene.
          var loader = new THREE.JSONLoader();
          loader.load( "models/cubic.js", function(geometry){
            var material = new THREE.MeshLambertMaterial({color: 0x55B663});
            mesh1 = new THREE.Mesh(geometry, material);
            scene.add(mesh1);
    		mesh1.position.x=-3;
          });

这是我的目标。因为iam将其颜色设置为0x55B663，就像这样我想为mesh1（对象立方体）的每个面添加不同的颜色。

Answer 1

你走了：

http://jsfiddle.net/1Lxq7x8w/

var camera, scene, renderer, geometry, material, mesh;

init();
animate();

function init() {

    scene = new THREE.Scene();

    camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
    camera.position.z = 500;
    scene.add(camera);

    geometry = new THREE.CubeGeometry(200, 200, 200);

    // Set random colours for each of the 6 faces :)
    geometry.faces[ 0 ].color.setHex( Math.random() * 0xffffff );
    geometry.faces[ 1 ].color.setHex( Math.random() * 0xffffff );
    geometry.faces[ 2 ].color.setHex( Math.random() * 0xffffff );
    geometry.faces[ 3 ].color.setHex( Math.random() * 0xffffff );
    geometry.faces[ 4 ].color.setHex( Math.random() * 0xffffff );
    geometry.faces[ 5 ].color.setHex( Math.random() * 0xffffff );

    material = new THREE.MeshBasicMaterial( { vertexColors: THREE.FaceColors } );

    mesh = new THREE.Mesh(geometry, material);
    scene.add(mesh);

    renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);

    document.body.appendChild(renderer.domElement);

}

function animate() {

    requestAnimationFrame(animate);
    render();

}

function render() {

    mesh.rotation.x += 0.01;
    mesh.rotation.y += 0.02;

    renderer.render(scene, camera);

}

是否可以使用Threejs为立方体的每个面添加不同的颜色

1 个答案: