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

时间:2013-07-08 01:10:25

标签: camera rotation three.js

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

当camera.rotate.y处于180度时,

camera.rotate.x可预测地向上或向下查看。

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

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

2 个答案:

答案 0 :(得分:12)

在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”会更直观,这相当于“航向,俯仰和滚动”。

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

three.js r.61

答案 1 :(得分:1)

这几天我一直在寻找相同的信息,诀窍是:使用常规的rotateX 向上/向下查看,但使用rotateOnWorldAxis(new THREE.Vector3(0.0, 1.0, 0.0), angle) 进行水平转向(https://discourse.threejs.org/t/vertical-camera-rotation/15334)。