时间戳

首页 > 解决方案 > 移动数组中的项目

javascript - 移动数组中的项目

问题描述

目前在阵列中有球体网格，并且希望能够将它们放置在一个关卡中。目前它们已经设置在一个位置（骨架形状），但我想移动整个阵列并将其放置在一个位置，而不是单独移动每个网格。这可能吗？

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);
}

标签： javascriptthree.js

解决方案

方法一

如果您使用额外的几何图形合并这些球体：

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

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

三.js 文档：

https://threejs.org/docs/index.html#api/en/core/Geometry：

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

方法二

编辑：（使用这种方法，网格将保持独立，它们也可以单独移动）

第二种方法是通过以下方式创建 object3d 层次结构：

fatherMesh.add(mesh1)

这是一个代码笔： https ://codepen.io/ThanosSar/pen/VwKoMLw

三.js 文档：

https://threejs.org/docs/index.html#api/en/core/Object3D：

.add ( object : Object3D, ... ) : this 添加对象作为该对象的子对象。可以添加任意数量的对象。此处传入的对象上的任何当前父级都将被删除，因为一个对象最多可以有一个父级。

推荐阅读