Three.js - 将自定义几何移动到原点

Posted 2023-02-27

【中文标题】Three.js - 将自定义几何移动到原点

【英文标题】：Three.js - move custom geometry to origin

【发布时间】：2012-10-01 20:52:29

【问题描述】：

我有一些从 STEP 文件转换中获得的自定义几何图形，我使用鼠标旋转它们。它们围绕场景的原点旋转，但由于它们远离它，它们似乎在虚拟球体上旋转。如何将它们移动到原点，以使它们看起来不会“漂浮”（我的意思是我想将虚拟球体的半径减小到零）。 This is the example I'd like to move。我已经尝试将他们的位置设置为 (0, 0, 0)：

object.position.x = 0;
object.position.y = 0;
object.position.z = 0;

但它没有工作。

【参考方案1】：

此问题的典型解决方案是在创建几何图形后立即对其进行平移。您可以通过将平移矩阵应用于几何体来做到这一点，如下所示：

geometry.applyMatrix( new THREE.Matrix4().makeTranslation( distX, distY, distZ ) );

编辑：您可以简单地这样做：

geometry.translate( distX, distY, distZ ); // three.js r.72

geometry.computeBoundingBox() 函数可能有助于您确定翻译量。

但是，我在您的情况下看到，您有多个几何形状，因此它有点复杂，但可行。您需要将每个几何图形平移相同的量。

编辑

提示：不要将每个对象添加到场景中，而是创建一个父对象，将其添加到场景中，然后将对象添加到父对象。

var parent;

parent = new THREE.Object3D();
scene.add( parent );

parent.add( object1 );
parent.add( object2 );
// and so on...

然后在您的渲染函数中，只旋转父对象，而不是单个对象。

【讨论】：

感谢您的回答。使用父对象似乎并没有改变这种情况，所以我会尝试第一个建议

父对象建议不是解决方案的一部分，只是一个友好的提示。 :-) 如果您选择实施它，请参阅***.com/questions/12795775/… 答案中的“技巧”作为解决问题的替代方法。

哦，现在我明白了，谢谢 ;-) 我创建了一个对象，将父对象添加到它，然后将所有几何图形添加到父对象。但我仍然不明白如何将父级移动到原点。如果我对父级使用 computeBoundingBox() 函数，然后我得到边界框的中心，我应该将父级移到那里吗？

既然您决定使用父技巧，而不是转换几何本身，请尝试parent.position.set( -800, 300, -800 ) 看看它是否会变得更好。这更像是原始边界框的负值，您可以精确计算。

也许我做错了什么，但情况并没有好转。我已经更新了我使用的页面sygest.agintersys.com/testing.html：object = new THREE.Object3D();场景.add(对象);父 = 新的 THREE.Object3D(); parent.position.set(-800, 300, -800) object.add(parent);父.add(object0);父.add(object1); ...