webgl - 如何在 Three.js 中克隆 object3d？

Question

我想克隆一个用loader加载的模型，我在github上发现了这个问题，但解决方案不起作用。Object3D 似乎发生了结构变化。

如何在当前稳定版本的 Three.js 中克隆 Object3D？

Answer 1

在这个新版本的 three.js 中，您有一个方法clone。

例如，我使用国际象棋中的皇后，我不得不重复多次：

// queen is a mesh
var newQueen = queen.clone();

// make sure to re position to be able to see the new queen!
newQueen.position.set(100,100,100); // or any other coordinates

它适用于任何网格。

我使用了three.js r61。

Answer 2

其实mrdoob的答案就是你的答案......

加载器输出用于创建网格的几何图形。您需要使用加载器创建的网格的几何形状和材质创建一个新的网格。

for ( var i = 0; i < 10; i ++ ) {
    var mesh = new THREE.Mesh( loadedMesh.geometry, loadedMesh.material );
    mesh.position.set( i * 100, 0, 0 );
    scene.add( mesh );
}

您想克隆一个 Mesh 而不是 Object3D，因为加载器的输出是一个 Mesh。

Answer 3

我找到了一种快速的解决方案（不是最有效的）GLTFLoader

在内部使用THREE.FileLoader()方法，它允许您缓存文件。 为此，您需要在创建GLTFLoader实例之前添加此行

THREE.Cache.enabled = true;

然后你可以多次加载同一个模型，但只有第一次会花费更长的时间，例如：

THREE.Cache.enabled = true;

var loader = new GLTFLoader();

var deeplyClonedModels = [];

for( var i = 0; i < 10; i++ ){

   loader.load('foo.gltf', function ( gltf ) {

     deeplyClonedModels.push(gltf.scene);

  });

}