Three.js 포지션을 지정하고 카메라를 지시하십시오

Question

Three.js에서 그러한 중심적인 문제에 대한 답을 찾기 위해 수 시간 또는 수일간 검색을 한 후에는 불가능합니다 : 1) 카메라의 위치 (내 눈) 2) 카메라의 방향 (내 눈) 3) 내 머리의 방향. 카메라를 생성합니다 (우리는 카메라 각도를 near/far, aso로 무시합니다). 다음과 같이 내가 할 가장 가까운입니다

eye_deg1가 눈 (-90 : 90, 하단에 보면 : 위쪽으로 보이는)의 높은

camera = new THREE.PerspectiveCamera(150, window.innerWidth/window.innerHeight, 0.1, 5000); 

    camera.position.x = myParams.eye_x; 
    camera.position.y = myParams.eye_y; 
    camera.position.z = myParams.eye_z; 

    camera.rotateOnAxis(new THREE.Vector3(0,0,1), Math.PI /2); 
    camera.rotateOnAxis(new THREE.Vector3(0,0,1), Math.PI * (myParams.eye_deg2)/180); 
    camera.rotateOnAxis(new THREE.Vector3(sin(myParams.eye_deg2),-cos(myParams.eye_deg2),0), Math.PI * (myParams.eye_deg1+90)/180); 

    camera.updateProjectionMatrix(); 

, eye_deg2 (XY 평면 방향, 0 : -x 방향) .

처음 두 회전은 동일한 축에 있으며 한 단계로 수행 할 수 있습니다. 두 번째 회전이 작동하지 않습니다.

위치와 회전 설정을 전환하면 변경 사항이 적용되지 않습니다 (회전은?,?로 통근하지 않습니다).

하지만 솔직히 카메라를 생성하는 함수가 필요하며 아무런 설명이 필요하지 않습니다. 나는 왜 그런 간단한 문제를 해결해야하는지 이해할 수 없다. 나는 3D 그래픽에 대해 600pg의 책을 읽어야한다 ....

눈 벡터는 (-cos a1 cos a2, -cos a1 sin a2, sin a1) 여기서, a1 = eye_deg1 및 a2 = eye_deg2이다. Three.js 기본값은 (0,0, -1), 즉 a1 = -90 (하단)

머리 벡터는 (-sin a1 cos a2, -sin a1 sin a2, cos a1)입니다. Three.js 기본값은 (0,1,0), 즉 a2 = 90입니다.

예 : a1 = 0. 눈 벡터는 (-cos a2, -sin a2,0)이며, 머리 벡터는 (0,0,1)입니다.

Answer 1

용액

camera = new THREE.PerspectiveCamera(150, window.innerWidth/window.innerHeight, 0.1, 5000); 

camera.position.x = myParams.eye_x; 
camera.position.y = myParams.eye_y; 
camera.position.z = myParams.eye_z; 

camera.up.set( 
    -sin(myParams.eye_deg1) * cos (myParams.eye_deg2), 
    -sin(myParams.eye_deg1) * sin (myParams.eye_deg2), 
    cos(myParams.eye_deg1) 
); 
camera.lookAt(new THREE.Vector3(
    myParams.eye_x - cos (myParams.eye_deg1) * cos (myParams.eye_deg2), 
    myParams.eye_y - cos (myParams.eye_deg1) * sin (myParams.eye_deg2), 
    myParams.eye_z + sin (myParams.eye_deg1) 
));