在 three.js 中根据对象的旋转移动对象

Posted 2023-02-27

【中文标题】在 three.js 中根据对象的旋转移动对象

【英文标题】：Moving a object based on its rotation in three.js

【发布时间】：2013-04-02 09:41:59

【问题描述】：

我正在尝试根据它的旋转在 three.js 中移动一个立方体，但不确定如何去做。

到目前为止，我可以使用 A 和 D 键旋转立方体的 z 轴旋转。使用 W 键，我希望它相对于它的旋转向前移动。

从 2D 开始，我会这样做：

float angle = GradToRad(obj.rotation);
obj.x = obj.x + cos(angle) * velocity;
obj.y = obj.y + sin(angle) * velocity;

这是当前实现的图像。

如何在 three.js 中应用类似的东西？

【参考方案1】：

可以认为对象面向其正 Z 轴。所以要向前移动一个对象，相对于它自己的坐标系，你可以使用

Object3D.translateZ( distance );

three.js r.57

【讨论】：

是的，但仅沿 Z 轴平移将不允许我的对象相对于其旋转移动。意思是当我转身时，我希望它沿着它的“面”移动。

当它的旋转向量是（0,0,0）时，你的对象“面向”哪个方向？这是应用旋转后要移动的局部方向。

我绕 Z 轴旋转。

当它的旋转向量是（0,0,0）时，你的对象“面向”哪个方向？

天哪，我现在觉得自己很傻！翻译！与设置位置不同......我认为这背后有一些更高级的数学，但可以。是的，它有效 :) 谢谢一群朋友！

【参考方案2】：

在单个（同质投影）4×4 matrix 中同时表达旋转和平移可能是最简单的。 three.js 中的 Object3D.matrix 成员已经这样做了，尽管您可能必须将 matrixAutoUpdate 设置为 false 才能直接使用它。然后你可以移动使用translate方法在它自己的参考框架中移动对象。

【讨论】：

极不建议用户直接在three.js中乱搞对象矩阵。只有当你真的知道自己在做什么并且熟悉库的内部运作时才这样做。

【参考方案3】：

您的 2D 方法正是我在 three.js 中所做的。对于 Y 位置，我使用的是地形碰撞技术（仍然需要改进）；