在Three.js中任意位置的特定轴上旋转对象-包括网格外部

小编典典

在Three.js中任意位置的特定轴上旋转对象-包括网格外部

javascript

试图绕任何轴旋转对象。

例如，像门铰链（在物体边缘）或围绕太阳的行星（在物体外部）。

问题似乎在定义轴。下面的单位向量导致轴保留在对象的原点（中心）上，与标准旋转相同：

object2.rotateOnAxis(new THREE.Vector3(1,0,0), 0.01);
// same as
object1.rotation.x += 0.01;

编辑： 寻找一种无需使用嵌套子项即可绕枢轴旋转的方法。旋转孩子的父母可以方便地操作孩子的枢轴点，但是修改枢轴点是不可行的。

在下面的示例中，如果您想以图8的运动旋转立方体，则可以通过更改父对象来使用此方法来实现。但是，必须确保精确配置了新父母的位置和方向，以使孩子在父母之间无缝地跳跃，而且不重复或不循环的复杂动作将非常复杂。取而代之的是，我想（并且我将用问题标题来解释）在特定轴上旋转对象，而无需在场景中的任何位置（包括对象网格外部）使用对象嵌套。

阅读 1159

2020-05-01

共1个答案

小编典典

如果要围绕世界空间中的任意线旋转对象，可以使用以下方法。该线由3D point和方向矢量（axis）指定。

THREE.Object3D.prototype.rotateAroundWorldAxis = function() {

    // rotate object around axis in world space (the axis passes through point)
    // axis is assumed to be normalized
    // assumes object does not have a rotated parent

    var q = new THREE.Quaternion();

    return function rotateAroundWorldAxis( point, axis, angle ) {

        q.setFromAxisAngle( axis, angle );

        this.applyQuaternion( q );

        this.position.sub( point );
        this.position.applyQuaternion( q );
        this.position.add( point );

        return this;

    }

}();

three.js r.85

2020-05-01