Rotation
3D Rotation
3차원 회전을 다룰 때 사용되는 대표적인 방법들로 Euler
,Quaternion
가 있다.
X, Y, Z 축에 대해 서로 다른 방식으로 회전을 정의한다.
Euler(오일러)
세가지 회전 축(x, y, z)을 하나씩 연속해서 계산하여 표현하는 방식 (계산 순서는 변경 가능하다.)
오일러 각은 오브젝트의 세가지 축(X, Y, Z)을 중심으로 한 회전을 정의하는 세 가지 각도 집합이다.
즉, 축에서 회전할 때의 각도를 의미한다.
물리학자인 레오나르드 오일러의 이름을 따서 명명됨
장점
방향을 설명하는 세개의 각도만 있어 회전 계산이 직관적이고 이해하기 쉽다.
단점
세 가지 각도로만 움직이는 것에 한계와 제약이 있다.
X -> Y -> Z 축 회전이 순서대로 계산되어
짐벌락
현상이 발생한다.
Quaternion(쿼터니언)
오일러와 달리 4개의 값(회전 축 + 각도)의 조합으로 3D 공간의 모든 회전을 나타낼 수 있는 수학적 개념
회전의 축을 결정하는 X, Y, Z 의 벡터와 회전 양을 결정하는 W
장점
X,Y,Z 축을 한번에 계산하기 때문에 짐벌락 현상이 일어나지 않는다.
회전 계산이 더 빠르고, 더 부드러운 회전을 제공한다.
단점
180° 이상의 회전을 표현하지 못한다.180°를 넘어가면 기준점에서 가까운 곳으로 회전한다.
TCB
Tension(장력), Continuity(연속성), Bias(바이어스)의 약자
Euler + Quaternion
쿼터니언은 더 안정적이고 정확하게 계산하는 이점이 있는 반면 복잡하고, 오일러는 단순하고 더 직관적이지만 회전을 표현하는데 제약이 있다. 작업하려는 목적, 요구사항에 따라 두 가지 방법을 조합하여 오일러 → 쿼터니언, 쿼터니언 → 오일러로 변환하여 작업을 수행하는 것이 효과적이다.
.Quaternion()
-> 쿼터니언 객체를 생성하는 생성자.Euler()
-> 오일러 각 객체를 생성하는 생섯자.setFromQuaternion(quaternion)
-> 쿼터니언을 사용하여 오일러 각을 설정하는 메서드.setFromEuler(euler)
-> 오일러 객체를 사용하여 쿼터니언을 계산하는 메서드
쿼터니언 -> 오일러
const quaternion = new THREE.Quaternion(x, y, z, w);
const quatToEuler = new THREE.Euler().setFromQuaternion(quaternion)
오일러 -> 쿼터니언
const euler = new THREE.Euler(x, y, z);
const eulerToQuat = new THREE.Quaternion().setFromEuler(euler);
Last updated