根据给定的摄像机旋转和位置计算用于轨道控制的摄像机目标

时间:2018-07-06 13:48:51

标签: javascript three.js 3d

使用轨道控件时出现以下问题。我将相机目标设置为0、0、0。然后在AJAX调用后,手动设置相机位置和旋转角度。轨道控件更新呼叫后,摄像机的旋转将重置。

我发现发生这种情况的原因是,当调用轨道控件更新时,会根据摄像机位置和轨道控件的目标来计算摄像机的旋转。

有什么办法解决这个问题吗?

1 个答案:

答案 0 :(得分:2)

在将变换应用于摄影机之前,我会节省摄影机与目标之间的距离。然后,我将目标按各自的距离放置在相机前面。

var distance = new THREE.Vector3().subVectors(camera.position, controls.target).length();

// apply transformation - matrix, euler rotation, or quaternion?

var normal = new THREE.Vector3(0,0,-1).applyQuaternion(camera.quaternion);
// instead of quaternion, you could also use .applyEuler(camera.rotation);
// or if you used matrix, extract quaternion from matrix

controls.target = new THREE.Vector3().add(camera.position).add(normal.setLength(distance));

编辑: 您能否解释一下为什么在法线计算中使用向量(0,0,-1)?

在计算机图形学中,照相机的局部坐标系通常是正x轴指向右侧,正y轴指向上方,因此,您要查看的方向是负z轴。对于上面的计算,我需要相机寻找的方向-从局部空间(0,0,-1)到世界空间(0,0,-1).applyQuaternion()

enter image description here