three.js中的网格

Question

我目前正在为使用three.js的项目开发一些3D模型。

我目前正在开发的模型由一组基本几何组成，这些几何一起用于表示防御塔。

明确地说，我有2个盒子，3个圆柱体代表上述塔。

包装盒：

var base = new THREE.Mesh(new THREE.BoxGeometry(7, 0.2, 7), new THREE.MeshPhongMaterial({color: 0xff000f}));
var head = new THREE.Mesh(new THREE.BoxGeometry(3, 1, 2.5), new THREE.MeshPhongMaterial({color: 0xaaffff}));

气瓶：

var body = new THREE.Mesh(new THREE.CylinderGeometry(0.5, 0.5, 5, 20), new THREE.MeshPhongMaterial({color: 0xffffff}));
var leftCannon = new THREE.Mesh(new THREE.CylinderGeometry(0.35, 0.35, 4, 20), new THREE.MeshPhongMaterial({color: 0xffffff}));
var rightCannon = new THREE.Mesh(new THREE.CylinderGeometry(0.35, 0.35, 4, 20), new THREE.MeshPhongMaterial({color: 0xffffff}));

请忽略材料的颜色，这是临时性的。

最初的想法是将每个这些网格分别添加到场景中：

scene.add(base);
scene.add(body);
scene.add(head);
scene.add(leftCannon);
scene.add(rightCannon);

但是，我认为确实存在更好的方法，至少可以在不降低性能的情况下拥有更多的能力。

我当时正在考虑使用一个具有所有几何形状的容器，然后将一个对象而不是多个对象添加到场景中。

考虑到这一点，我想为每个单独的网格使用特定的材质（例如，大炮为金属色，底部为深色），并且我还希望保持分别平移/旋转/缩放网格的能力（现在鼠标拖动和WASD键移动塔的头部）。

Answer 1

创建一个THREE.Object3D或THREE.Group并将网格物体添加到该对象。 将此对象添加到场景中。 这将保留从单个零件转换和更改材质的选项。