Three.js - 如何创建自定义形状

Question

我正在使用Three.js并尝试创建一些自定义形状，类似于使用threejs的代理商之一的项目中出现的形状：

three.js精选项目实例

他们是如何在内部生成带孔的盒子的？ （就那个例子而言 盒子基本上只有边框，里面是空的。）

  

正如我在代码中看到的那样（我试图弄明白自己）他们使用 BoxGeometry ，但我不知道如何实现这一目标。有谁知道或可以给我任何指示？这将是非常有帮助的，因为我坚持这一点，并不知道如何创建它们。

Answer 1

所以在THREE.js中，Meshes代表任何类型的3D对象。它们结合了Geometries和Shaders。通常要创建一个你调用的网格

var mesh = new THREE.Mesh( geometry, shader );

如果你使用任何内置着色器（也称为Materials [MeshBasicMaterial，MeshLambertMaterial等]），它们都有一个允许此功能的wireFrame布尔属性。

var geometry = new THREE.BoxGeometry( x, y, z ),
    material = new THREE.MeshBasicMaterial( { 
        wireFrame: true, // This makes the object appear wireframe
        color: 0xffffff  // You can alter other properties
    });

var box = new THREE.Mesh( geometry, material );

// You can also change it later
box.material.wireFrame = false;