围绕世界轴旋转对象

时间:2015-05-12 13:11:43

标签: javascript rotation three.js

我找到了几种不同的工作方式来围绕世界轴旋转物体但是所有这些物体都围绕它自己的轴旋转物体而不是围绕世界旋转物体。那么,围绕世界轴旋转物体的正确方法是什么?

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

enter image description here

编辑:对不起,我应该在问题中说明我正在使用Three.js

EDIT2:

//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

2 个答案:

答案 0 :(得分:0)

使用四元数。

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

答案 1 :(得分:0)

我最终使用了FirstPersonControls类。我不得不对班级进行一些改动