javascript - 三个 JS 万向节锁在旋转

Question

看来Three JS中的四元数旋转并没有摆脱Gimbal Lock。

重现步骤:

1) 打开 Three JS Editor .2) 添加一个Cylinder 并将z 的值设置为1.57(旋转的中心文本框)。3) 现在尝试更改 y 或 x 弧度的值(旋转的左文本框或右文本框)。

您会看到 x 和 y 都执行相同的旋转。有什么想法可以避免这种情况吗？

AFAIK Three JS 默认使用四元数，万向节锁定仅在您使用欧拉 Angular 时发生。

谢谢!

Answer 1

代码中:尝试在三个js中修改一个对象的四元数属性，而不是旋转属性。这样你就可以确保通过使用四元数来避免万向节锁定。

在编辑器中，您只能使用欧拉 Angular 进行编辑，并且由于许多欧拉 Angular 表示可能会导致相同的四元数，因此旋转是不明确的；