围绕世界轴旋转对象

Rotate object around the world axis

我发现了几种不同的绕世界轴旋转对象的有效方法,但所有这些方法都使对象绕着它自己的轴旋转,而不是绕着世界轴旋转。那么,围绕世界轴旋转对象的正确方法是什么?

如果我不清楚问题,这里有一张图可以说明我的问题

编辑:抱歉,我也应该在问题中说明我正在使用 Three.js

编辑2:

//camera is the object I want to rotate 
//I also found a method that uses Euler but the result was far from the expected

/**Method 1**/

//Found this somewhere here in so
var rotateAroundWorldAxis = function(object, axis, radians) {
  var rotWorldMatrix;
  rotWorldMatrix = new THREE.Matrix4();
  rotWorldMatrix.makeRotationAxis(axis.normalize(), radians);
  rotWorldMatrix.multiply(object.matrix);
  object.matrix = rotWorldMatrix;
  object.rotation.setFromRotationMatrix(object.matrix);
}

//this is how I call the method
rotateAroundWorldAxis(camera, new THREE.Vector3(0,1,0), movementX*-0.001);
rotateAroundWorldAxis(camera, new THREE.Vector3(1,0,0), movementY*-0.001);
/**Method 1**/


/**Method 2**/
//I've also tried this method
var q = new THREE.Quaternion();

q.setFromAxisAngle( new THREE.Vector3(0,1,0), movementX*-0.001 ); // axis must be normalized, angle in radians
camera.quaternion.multiplyQuaternions( q, camera.quaternion );
/**Method 2**/


//movementX and movementY are values provided by the mouse movement using the pointerlock. 
//These values works as I've tried them using rotateOnAxis

使用四元数。

var rotateAroundWorldAxis = function(object, axis, radians) {
  var rotation = new THREE.Quaternion();
  rotation.setFromAxisAngle ( axis, radians );
  object.quaternion.multiply(rotation);
}

rotateAroundWorldAxis(myObject, THREE.Vector3(0,1,0), movementX*-0.001);

我认为你之前使用四元数方法的问题是四元数相乘顺序错误所以你围绕全局 Y 轴旋转,然后执行局部旋转,最终旋转在局部 Y 轴上。

我最终使用了 FirstPersonControls class。我不得不对 class 进行一些更改