Camera and User Interaction - WebGL Game Development - page 160

Comprehending the components of a camera matrix
A camera matrix is represented by four orthogonal unit vectors. These vectors define
the orientation and position of the camera in the scene. The look vector represents
the direction the camera is pointing to. The up vector denotes the upward direction.
The right vector points to the right of the camera, and finally the position element
says where the camera is positioned in the world. The breakdown of the final view
matrix is as follows:

Up.x
Up.y
Up.z
Positon.y

Right.x
Right.y
Right.z
Positon.x

Look.x
Look.y
Look.z
Positon.z

0.0f
0.0f
0.0f
1.0f

The following figure shows the three orthogonal vectors ( Up , Look , and Right ). The
vectors are orthogonal if their dot product is 0 (perpendicular to each other).

+Y

UP

+Z

+X

LOOK

RIGHT

Camera

Orientation and Position

Once we set our four orthogonal vectors, we can calculate our camera matrix,
as follows:

var cameraMatrix= -mat4.create();
mat4.multiplyVec4(cameraMatrix, [1, 0, 0, 0], this.right);
mat4.multiplyVec4(cameraMatrix, [0, 1, 0, 0], this.up);
mat4.multiplyVec4(cameraMatrix, [0, 0, 1, 0], this.normal);
mat4.multiplyVec4(cameraMatrix, [0, 0, 0, 1], this.position);