Three.js相机向上或向下倾斜并保持地平线水平

Question

camera.rotate.y以可预测的方式向左或向右平移.

当camera.rotate.y处于180度时,camera.rotate.x可预测地向上或向下查看.

但是当我将camera.rotate.y的值更改为某个新值,然后我更改camera.rotate.x的值时,地平线会旋转.

我已经找了一个算法来调整camera.rotate.x之后的地平线旋转,但还没有找到它.

Answer 1

在three.js中,对象的方向可以由其Euler旋转向量指定object.rotation.旋转矢量的三个分量表示分别围绕对象的内部x轴,y轴和z轴的弧度旋转.

执行旋转的顺序由下式指定object.rotation.order.默认顺序为"XYZ" - 首先围绕x轴旋转,然后是y轴,然后是z轴.

相对于对象的内部坐标系执行旋转- 而不是世界坐标系.这个很重要.因此,例如,在发生x旋转之后,对象的y轴和z轴通常不再与世界轴对齐.以这种方式指定的旋转不是唯一的.

因此,例如,如果在您指定的代码中,

camera.rotation.y = y_radians;  // Y first
camera.rotation.x = x_radians;  // X second
camera.rotation.z = 0;

旋转应用于对象rotation.order,而不是按照指定的顺序.

在您的情况下,您可能会发现设置rotation.order为"YXZ" 更直观,相当于"前进,俯仰和滚动".

有关欧拉角的更多信息,请参阅维基百科文章.正如文章中所解释的那样,Three.js遵循Tait-Bryan惯例.

three.js r.61