移动数组中的项

Question

目前在数组中有球体网格，并希望能够将它们放置在关卡中。目前他们已经设置在一个位置(骨架形状)，但我想移动整个数组，并把它放在一个位置，而不是单独移动每个网格。这可能吗?

var meshJoints = [];
for (var i = 0 ; i < 25 ; i++)
{
var geo = new THREE.SphereGeometry(0.02, 18, 18);
var mat = new THREE.MeshPhongMaterial({color: 0xCCCCCC});
var mesh = new THREE.Mesh(geo, mat);
meshJoints.push(mesh);
}

Answer 1

将所有网格添加到Group，然后移动Group。

var meshJoints = new THREE.Group();
for (var i = 0 ; i < 25 ; i++)
{
var geo = new THREE.SphereGeometry(0.02, 18, 18);
var mat = new THREE.MeshPhongMaterial({color: 0xCCCCCC});
var mesh = new THREE.Mesh(geo, mat);
meshJoints.add(mesh);
}
scene.add(group);
meshJoints.position.set(x, y, z); // setting group position will cascade to all children

AGroup是一个集合，它是自变换的。在Group上设置位置、旋转或缩放将把更改级联到它的所有子节点。在这种情况下，设置Group的position将导致所有Mesh移动相同的变化量。

Answer 2

方法1

如果你用一个额外的几何图形合并这些球体:

const mergedGeometry = new THREE.Geometry();
mergedGeometry.merge(mesh1.geometry, mesh1.matrix);

你可以设置合并网格的位置，它们将被重新定位。这是一个代码:https://codepen.io/ThanosSar/pen/JjRgyQz

three.js documentation:

https://threejs.org/docs/index.html api/en/核心/几何:

.merge ( geometry : Geometry, matrix : Matrix4, materialIndexOffset : Integer ) : null
Merge two geometries or geometry and geometry from object (using object's transform)

方法2

编辑:(使用此方法，网格将保持独立，它们也将能够单独移动)

第二种方法是创建object3d层次结构，只需:

fatherMesh.add(mesh1)

这是一个代码依赖:https://codepen.io/ThanosSar/pen/VwKoMLw

three.js documentation:

https://threejs.org/docs/index.html api/en/核心/Object3D:

。add (object: Object3D，…):这添加对象作为此对象的子对象。可以添加任意数量的对象。传入的对象的任何当前父对象将被删除，因为一个对象最多只能有一个父对象。