我有以下代码在Three.js场景中使相机绕X轴旋转:
var cameraOrginX = 0, cameraOrginY = 0, cameraOrginZ = 0;
var cameraEndX = 0, cameraEndY = 0, cameraEndZ = 1000;
var angle = 0;
function init(){
camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 10000 );
camera.position.set(0,0,1000);
//ROTATE THE CAMERA
var radians = angle * Math.PI / 180.0;
cameraEndY = Math.cos(radians) * (cameraEndY-cameraOrginY) - Math.sin(radians) * (cameraEndZ-cameraOrginZ) + cameraOrginY;
cameraEndZ = Math.sin(radians) * (cameraEndY-cameraOrginY) + Math.cos(radians) * (cameraEndZ-cameraOrginZ) + cameraOrginZ;
//
//CAMERA NEW POS
camera.position.x = cameraOrginX + cameraEndX;
camera.position.y = cameraOrginY + cameraEndY;
camera.position.z = cameraOrginZ + cameraEndZ;
console.log(camera.position.y + " " + camera.position.z);
}
当我将角度变量设置为0时,我的相机位置为x = 0,y = 0,z = 1000;这就是期望并且是好的。
但是当我将角度更改为90度时,例如,我的位置更改为x = 0 y = -1000 z = -999,99999;而您希望位置为x = 0,y = -1000,z = 0;
为什么会这样呢?有人可以向我解释我在做什么错:)
除了0以外的所有角度都给我怪异的位置:(
如果需要更多代码或jsfidle,请问我:)
cameraEndY = Math.cos(radians) * (cameraEndY-cameraOrginY) - Math.sin(radians) * (cameraEndZ-cameraOrginZ) + cameraOrginY;
cameraEndZ = Math.sin(radians) * (cameraEndY-cameraOrginY) + Math.cos(radians) * (cameraEndZ-cameraOrginZ) + cameraOrginZ;
您无法cameraEndY
在cameraEndZ
计算中使用它,因为它已被更新。你应该使用旧的y
和z
这个坐标rotation
计算,而不是更新的。请改用以下内容-
var cosTheta = Math.cos(radians);
var sinTheta = Math.sin(radians);
var a = cosTheta * (cameraEndY-cameraOrginY);
var b = sinTheta * (cameraEndZ-cameraOrginZ);
var c = sinTheta * (cameraEndY-cameraOrginY);
var d = cosTheta * (cameraEndZ-cameraOrginZ);
cameraEndY = a - b + cameraOrginY;
cameraEndZ = c + d + cameraOrginZ;
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句