javascript - 我可以在 three.js 中隐藏网格的面吗？

Question

我想让部分网格在运行时不可见。我可以将这些部分设置为不可见/透明，例如通过更改单个面的属性吗？网格本身仅使用一种材料。

---

编辑器理解这个问题的示例性插图：想象一个网格（这里有 20 个顶点的几何形状），其中四个顶点的每个四边形构建一个Face4. 现在，应该使网格的某些部分不可见（这里有两个面不可见）。

Answer 1

您可以为每个面指定不同的材质。这是一个面共享材质的示例，但有些面是透明的：

// geometry
var geometry = new THREE.BoxGeometry( 100, 100, 100, 4, 4, 4 );

// materials
materials = [
    new THREE.MeshLambertMaterial( { color: 0xffff00, side: THREE.DoubleSide } ),
    new THREE.MeshBasicMaterial( { transparent: true, opacity: 0 } )
];

// assign material to each face
for( var i = 0; i < geometry.faces.length; i++ ) {
    geometry.faces[ i ].materialIndex = THREE.Math.randInt( 0, 1 );
}
geometry.sortFacesByMaterialIndex(); // optional, to reduce draw calls

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

更新的小提琴显示了在运行时更改材质的一种方法：http: //jsfiddle.net/e0x88z7w/

编辑：MeshFaceMaterial已被弃用。发布和小提琴更新。

三.js r.87