围绕世界轴旋转对象

Question

我发现了几种不同的所谓工作方式来围绕世界轴旋转对象，但所有这些方式都保持围绕它自己的轴旋转对象而不是围绕世界旋转它。那么，围绕世界轴旋转对象的正确方法是什么？

如果我不清楚问题，这里有一张代表我的问题的图

编辑：对不起，我也应该在问题中说明我正在使用 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

Answer 1

我最终使用了 FirstPersonControls 类。不过，我不得不对课程进行一些更改

Answer 2

使用四元数。

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 轴上旋转.