は機能していないthree.jsでカメラを回転させ、適切

Question

私three.jsシーンでは、x軸の周りに私のカメラを回転させるために、次のコードを持っている：私は0私のカメラに角度変数を設定し

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); 
} 

位置はx = 0、y = 0、z = 1000にあります。これは期待していることであり、良いことです。

しかし、角度を90度に変更すると、私の位置はx = 0 y = -1000 z = -999,99999に変更されます。位置はx = 0、y = -1000、z = 0と期待していますが、

なぜこのようなことが起こりますか？誰かが私が間違っているのものを私に説明することができ:)

0を除く全ての角度が私に奇妙な位置を与える:(

より多くのコードやjsfidleの必要がある場合はちょうど私に尋ねる:)

Answer 1

​​

それがすでに更新されているので、あなたはcameraEndZ計算にcameraEndYを使用傾けます。このrotation計算では、古いyとzの座標を使用し、更新されたものは使用しないでください。代わりに以下を使用してください -

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;