javascript - Three.js从相机提取弧度旋转

我一直在努力解决四元数的概念，我认为这可能与这一特殊挑战有关。

如果您知道three.js，则可能熟悉等矩形全景视频示例。我一直想做的就是以我理解的每个轴的格式（弧度，度...）简单地提取相机在任何给定时刻的旋转。从理论上讲，我不应该能够简单地利用摄像机的rotation.x / y / z参数来找出这些值吗？不过，我得到了奇怪的价值观。

看看这个例子：
http://www.spotted-triforce.com/other_files/three/test.html

我在左上角输出相机的xyz旋转值，而不是期望值，这些数字在正负之间反弹。

现在，此示例不使用可用的控制脚本之一。而是，它创建一个向量来计算要观察的相机目标。相机代码如下所示：

function init() {
  camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 1100 );
  camera.target = new THREE.Vector3( 0, 0, 0 );
}

function onDocumentMouseDown( event ) {

  event.preventDefault();
  isUserInteracting = true;

  onPointerDownPointerX = event.clientX;
  onPointerDownPointerY = event.clientY;

  onPointerDownLon = lon;
  onPointerDownLat = lat;

}

function onDocumentMouseMove( event ) {

  if ( isUserInteracting === true ) {

    lon = ( onPointerDownPointerX - event.clientX ) * 0.1 + onPointerDownLon;
    lat = ( event.clientY - onPointerDownPointerY ) * 0.1 + onPointerDownLat;

  }
}

function onDocumentMouseUp( event ) {
  isUserInteracting = false;
}

function update() {

  lat = Math.max( - 85, Math.min( 85, lat ) );
  phi = THREE.Math.degToRad( 90 - lat );
  theta = THREE.Math.degToRad( lon );

  camera.target.x = 500 * Math.sin( phi ) * Math.cos( theta );
  camera.target.y = 500 * Math.cos( phi );
  camera.target.z = 500 * Math.sin( phi ) * Math.sin( theta );

  camera.lookAt( camera.target );

}

有人知道我得到的这些奇怪值是什么，如何提取合适的旋转值，然后将其用于另一个对象以反映运动？

最佳答案

如果您设定

camera.rotation.order = "YXZ"

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

rotation.y将是摄像机的弧度方向

rotation.x是摄像机的弧度，以弧度为单位

rotation.z将是相机弧度的弧度

旋转将按该顺序应用。

three.js r.70

关于javascript - Three.js从相机提取弧度旋转，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28569026/