look towards

Instead of sliding to the selected waypoint, the model will now turn towards them. Rather than snapping to the waypoint, we will turn towards it at a speed controllable by the application. This method is useful as a simple way to make models behave as if they have rotational inertia. The 1, 2, and 3 keys command the model to turn towards the red, green, and blue cubes.

First, the amount the model can turn since the last frame is computed base on the elapsed time and rotational speed of the model. Then this angle, the mesh, and the target to turn towards are passed to the lookTowards helper function.

var dTheta = dt*this.rotSpeed;

This code uses quaternions instead of rotation matrices to represent the orientation of models. Quaternions are a concise way to describe rotation with a vector of four numbers, often written (x,y,z,w). A rotation of angle A around an axis specified by unit vector (x1,y1,z1) corresponds to the quaternion (x1*sin(A/2), y1*sin(A/2), z1*sin(A/2), cos(A/2)). Pretty straightforward. Even better, it often works very well to animate an object from one orientation to another simply by linearly interpolating between the corresponding quaternions, a process known as "slerp". The lookTowards function uses the native quaternion slerp function to perform the rotation. It performs the rotation while preserving the up direction of the model.

that.mesh.useQuaternion = true;

sets the object to use quaternions to represent its orientation. Note that if an object is not using quaternions, helper functions like quat.setFromRotationMatrix(mat) can convert a rotation matrix to a quaternion.

The angle between two quaternions is computed by the angleBetweenQuats function, which requires a deeper knowledge of quaternions to derive.

example 12: look towards