drehen Kamera in three.js nicht richtig

Question

i arbeiten, haben den folgenden Code meine Kamera um die x-Achse in einer three.js Szene zu drehen:

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

wenn ich die Winkelgröße auf 0 meine Kamera so einstellen, Position ist bei x = 0, y = 0, z = 1000; das ist was erwartet und ist gut.

aber wenn ich den Winkel zum Beispiel auf 90 Grad ändere, wird meine Position geändert in x = 0 y = -1000 z = -999,99999; während Sie erwarten würden, dass die Position x = 0, y = -1000, z = 0 ist;

Warum passiert das? könnte mir jemand erklären, was ich falsch :) mit Ausnahme von 0 gib mir seltsam Positionen :(

, wenn es eine Notwendigkeit für mehr Code oder ein jsfidle fragen Sie mich

alle Winkel tue :)

Answer 1

cameraEndY = Math.cos(radians) * (cameraEndY-cameraOrginY) - Math.sin(radians) * (cameraEndZ-cameraOrginZ) + cameraOrginY; 
cameraEndZ = Math.sin(radians) * (cameraEndY-cameraOrginY) + Math.cos(radians) * (cameraEndZ-cameraOrginZ) + cameraOrginZ; 

Sie kann nicht cameraEndY in cameraEndZ Berechnung verwenden, da es bereits aktualisiert wurde. Sie sollten die alte y und z Koordinate in dieser rotation Berechnung verwenden, nicht die aktualisierten. Verwenden Sie die folgenden stattdessen -

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;