Three.js - 轮换不尊重当地的方向

Hob*_*Joe 4 javascript 3d rotation three.js

我正在使用围绕场景中心点构建的大量对象,并且需要围绕它们的局部轴操纵它们.它们都使用空白对象和lookAt()面向原点,然后我使用此方法正确对齐其他轴.以这种方式获得初始旋转效果很好,不幸的是,当我尝试动态旋转这些对象时object.rotation.x = <amount>,它不尊重对象的局部轴.

令人困惑的部分是,它甚至不使用全局轴,它使用的轴几乎完全是任意的.我在这里设置了一个JSFiddle来演示这个.正如您在129行上看到的那样looker.rotation.z,它可以正常工作,它可以正确地沿Z轴旋转,但是如果它改为X或Y,则它不会沿局部轴或全局轴旋转.如果有人能揭开发生这种情况的神秘面纱,那就太好了.

jmm*_*mut 8

发生的事情是你想要向当前方向添加一些旋转,设置变量looker.rotation.z意味着其他东西.

最后,为了计算外观的旋转矩阵,会有类似的东西(伪代码:函数不是这些,但你明白了):

this.matrix.multiply( makeXRotationMatrix(this.rotation.x) )
this.matrix.multiply( makeYRotationMatrix(this.rotation.y) )
this.matrix.multiply( makeZRotationMatrix(this.rotation.z) )
DrawGeometry(this.geom, this.matrix)
Run Code Online (Sandbox Code Playgroud)

旋转的组成并不直观.这就是为什么它似乎不遵循任何轴系统.

如果你想在某个坐标轴来应用旋转到现有矩阵,它可以与功能进行rotateX (angle),rotateY (angle),rotateZ (angle),和rotateOnAxis (axis, angle).axis可以是一个THREE.Vector3.

直接改变looker.rotation.z是有效的,因为它是几何体最近的旋转,并且它不会受到其他旋转的影响(请记住,转换矩阵以相反的顺序应用,例如,T*R*G正在R旋转G测量,然后T翻转它).

摘要

在这种情况下,我建议不要使用该行:

looker.rotation.z += 0.05;
Run Code Online (Sandbox Code Playgroud)

使用

looker.rotateZ (0.05);
Run Code Online (Sandbox Code Playgroud)

要么

looker.rotateX (0.05);
Run Code Online (Sandbox Code Playgroud)

代替.希望这可以帮助 :)