[three.js] camera.position.set() / camera.rotation.set()

1. camera.position.set(x, y, z)

2. camera.rotation.set(z, y, x)

 

카메라 position / rotation의 set값에 들어가는 값이 각각 다르다 

camera.position.set은 

x (좌우)

y (상하)

z (앞뒤)
값이지만

 

camera.rotation.set은

z (yaw / heading) : z축을 기준으로 좌우방향으로의 회전 
y (pitch / attitude) : y축을 기준으로 상하방향으로 회전

x (roll / bank) : x축을 기준으로 차체나 물체의 좌우기울임, roll각은 비행기 날개가 좌우로 기울어지는 동작

 

 

 

tip : camera.rotation 값을 숫자로 / x, y, z 순서대로 적고싶을 때

var euler = new THREE.Euler(1, 2, 3, 'XYZ');

camera.rotation.copy(euler);
이유 : 세 개의 각도 값을 모두 직접 설정하는 것은 예상치 못한 결과를 낼 수 있음. 오일러 각은 회전 순서에 따라 결합되기 때문이다. 원하는 회전을 얻기 위해서는 위와 같은 방법을 사욯하는 것이 좋다.