三js摄像头。旋转y到360度转换

Question

我正在尝试旋转一个与这三个元素相关的2D对象（在GTA风格的小地图覆盖中）。js摄像机旋转。我的3D场景中的y值。

问题是相机返回的弧度。旋转y值有点奇怪，从0开始

有人知道如何将这些值转换或翻译成360个坐标吗？

我用的是透视相机和轨道控制。

提前谢谢！

Answer 1

camera.rotation是一个所谓的欧拉角，您也可以在three.js文档中阅读THREE. Object3D（这是THREE. Camera类的基类）。您不能简单地从欧拉角直接获得与某个轴的角度，因为您获得的角度取决于欧拉的顺序。

Answer 2

如果你设定

camera.rotation.order = "YXZ"

（默认值为“XYZ”）欧拉角对您来说更有意义：

旋转。y将是以弧度为单位的相机航向

旋转。x将是摄像机的俯仰角，以弧度为单位

旋转。z将是摄像机的滚动弧度

轮换将按此顺序进行。

有关更多信息，请参阅此答案。

三js r.84

Answer 3

我认为这可能与四元数旋转的转换有关。不确定下面的例子是否正确，但它可能有助于您找到解决方案。

const euler = new THREE.Euler();
const rotation = euler.setFromQuaternion(camera.quaternion);
const radians = rotation.z > 0
    ? rotation.z
    : (2 * Math.PI) + rotation.z;
const degrees = THREE.Math.radToDeg(radians);

这会导致度的值从0到360，但随着相机旋转，角度值似乎以不一致的速率变化。

下面是一个代码笔，演示了这种行为：

http://codepen.io/kevanstannard/pen/NdOvoO/

我使用了以下问题中的一些细节：

three.js透视摄像电流角度（度数）

编辑#1

根据@WestLangley的答案，我上面的答案是不正确的，所以为了记录改进，这里有一些基于West解决方案的代码：

// Set Y to be the heading of the camera
camera.rotation.order = 'YXZ';

然后

const heading = camera.rotation.y;
const radians = heading > 0 ? heading : (2 * Math.PI) + heading;
const degrees = THREE.Math.radToDeg(radians);

还有更好的密码笔

http://codepen.io/kevanstannard/pen/YNJgXd