Three.js add：保留位置

Question

当我将一个Object3D添加到另一个Object3D（“添加”方法）时，该子项根据父项的变化更改其变换。

有没有办法在孩子添加到父母后保持位置/旋转/缩放比例？

小提琴：https://jsfiddle.net/pqfzd8a2/1/

mesh = new THREE.Mesh(geometry, material);  
mesh.position.y = 25; 

var mesh2 = mesh.clone(); 
mesh2.position.y = 80; 

var mesh3 = mesh2.clone(); 

mesh.rotation.z = Math.PI*0.25; 

scene.add(mesh);  
mesh.add(mesh2); 
scene.add(mesh3); 

做了什么？

1. 网格被旋转。
2. mesh2和mesh3是相互位置相同的克隆。
3. 将mesh2添加到网格中，同时将mesh3添加到场景中。

mesh2和mesh3之间的区别在于它们被添加（父）到不同的父母（以相应地网格化和直接到场景）。在被添加（父）之前，他们处于相同的位置。重点是保持对象在被添加之前的位置（父对象）。

预期结果：mesh2和mesh3应该在相同的位置。

实际结果：mesh2在添加后改变位置/旋转/缩放比例。

如何使对象在被父对象保持其全局变换？

Answer 1

那么这就是定义的行为，至少是存在这些层次结构的原因。如果您不希望将父母的变换应用于孩子，则没有理由将这些项目父母亲。

使用这种方法处理复杂的物体要容易得多，这些复杂的物体由较小的物体组成，例如带车轮的汽车。而不是移动汽车，然后移动每个车轮，而是移动汽车的车轮，并且它们一直移动/旋转/缩放。这就是父母的转变如何被所有的孩子“继承”。所以他们的转变是相对他们各自的父母。就像月亮围绕地球旋转，围绕太阳旋转，围绕太阳旋转，它围绕着天空转动...

如果您确实需要取消父母在孩子内部的转换，那么您需要将父母转换的逆应用于孩子的转变，但正如我所说，这没有多大意义，因为你只是不需要父母和你的完成。

Answer 2

不，他们不应该在相同的位置，因为你正在改变网格和mesh2的位置和旋转。如果您要将网格添加到另一个网格，则将其添加到父上下文。

mesh.add(mesh2); // <-- mesh is translated and rotated, mesh2 will inherit the same context 

在这拨弄你看到，网格旋转也适用于mesh2：https://jsfiddle.net/r57opdgn/