Question

我有一个网格，它是Object3D的子级，它是场景的子级。

Object3D沿X轴旋转了90度。

孩子没有应用旋转，并且在其局部空间中保持Y向上和Z向前的方向。

作为THREE.js API的菜鸟，我的问题是：使孩子的旋转与世界Y对齐的最有效方法（就算法而言）是什么？

就是说，如果其父对象已沿X轴旋转了90度，那么应该更新其子对象的局部旋转，以便其上矢量仍指向全局Y轴？

我可以获取对象的世界四元数以获取局部旋转和全局旋转之间的差异，然后进行局部调整吗？

好吧，我发现的最简单的窍门是反转父母的四元数并将其应用于孩子，以使它的局部旋转在世界空间中保持不变：

        var inv = mesh.parent.quaternion.clone(); 
        inv.conjugate();
        mesh.quaternion.copy(inv);

Answer 1

您希望子网格保持右侧朝上并与坐标轴对齐-即使旋转了网格的父网格。

有几种方法可以做到这一点。最佳选择取决于您的用例或个人喜好。

您提出的解决方案无需克隆即可实现：

mesh.quaternion.copy( mesh.parent.quaternion ).conjugate();

另一种方法是定义一个onBeforeRender()方法来修改网格的世界矩阵：

var func = function() {

    var v = new THREE.Vector3();

    return function func() {

        v.setFromMatrixPosition( this.matrixWorld );
        this.matrixWorld.makeTranslation( v.x, v.y, v.z );

        // or you could do this, instead
        //this.quaternion.copy( this.parent.quaternion ).conjugate();
        //this.updateMatrixWorld();

    };

}();

mesh.onBeforeRender = func;

three.js r.94

在世界空间中保持局部旋转不变

1 个答案: