If my goal is to apply a rotation to each new Vector3 I create, what is the difference between:
const angle = 0.6;
const quaternion = new THREE.Quaternion().setFromAxisAngle(new THREE.Vector3(1, 0, 0), angle);
newPoint.applyQuaternion(quaternion);
and
const angle = 0.6;
const matrix = new THREE.Matrix4().makeRotationX(angle);
newPoint.applyMatrix4(matrix);
When do I use which? And what’s the difference?
The examples above will have the same effect.
While a quaternion represents only an orientation (or “rotation”) in space, a matrix can represent orientation as well as position, and scale. When dealing with position, rotation, and scale all together, it is often convenient to represent them as a single matrix.
Okay, got it. I just checked the docs and found this works as well:
const angle = new THREE.Vector3(1,0,0);
newPoint.applyAxisAngle(angle,0.6)
So I understand now that Matrix4 is useful for multiple orientation changes… is there any speed/benefit between the quaternion approach and applyAxisAngle?
Not that I’m aware of. If you were doing a lot of these operations in a loop, it might be worthwhile to measure both, but they’re probably similar for most purposes. Because three.js must support all types of transforms, it generally represents object transformations with matrices internally.
@WasteX If you are new to this topic I suggest you read the chapter “Rotation in Three Dimensions” from the book “3D Math Primer for Graphics and Game Development” by Fletcher Dunn and Ian Parberry. It provides an in-depth explanation of the different approaches for representing orientation in 3D space and also a comparison of all methods.