如何使立方体的内部颜色在 Three.js 中可见?

Gol*_*old 4 javascript three.js

我想从一个立方体开始用 THREE.js 建造一个房间。到目前为止我有以下代码:

function loadModelcube() {
    console.log("Inside the function");
    cube.traverse( function( node ) {
    if( node.material ) {
        node.material.side = THREE.DoubleSide;
        }
    });
    scene.add( cube );
}

var geometry = new THREE.BoxGeometry(100,50,100);
var material = new THREE.MeshBasicMaterial({color: 0xff4444, wireframe: false}); 
cube = new THREE.Mesh(geometry, material);

var managercube = new THREE.LoadingManager( loadModelcube );
Run Code Online (Sandbox Code Playgroud)

使用上面的代码,立方体并不像预期的那样可见。另外,我没有看到控制台日志记录按预期打印出来(即由于loadModelcube()调用了函数)。有谁知道出了什么问题?

Dac*_*nny 5

为了使盒子几何体从内部可见,您需要确保适当地设置了sidematerial(即分配给网格的场) 。cube

在您的情况下,设置material.sideTHREE.BackSide将达到预期的结果。

应用以下更改应该对您有用:

var geometry = new THREE.BoxGeometry(100,50,100);
var material = new THREE.MeshBasicMaterial({color: 0xff4444, wireframe: false}); 

/* Cause the material to be visible for inside and outside */
material.side = THREE.BackSide; 

var cube = new THREE.Mesh(geometry, material);
scene.add(cube);
Run Code Online (Sandbox Code Playgroud)

或者,如果您希望立方体从内部和外部都可见,您可以设置material.sideTHREE.DoubleSide