Matrix math

From GPWiki

Almost all 3d programs and libraries describe transformations in space by using 4 by 4 matrices. Any combination of rotation, translation and scaling can be described by such matrices, and because a series of transformations can be condensed into a single matrix, applying transformations this way is rather efficient.

1 Background
2 Combining matrices
3 Transformations
4 External Resources

[edit]

Background

So what is a matrix, and how do they transform points? Quite simply, a matrix is an n by m grid of values. This is a matrix:

$\begin{bmatrix} 1 & 0 & 0 & 0 \\ 0 & 1 & 0 & 0 \\ 0 & 0 & 1 & 0 \\ 0 & 0 & 0 & 1 \\ \end{bmatrix}$

And in fact this is not just any matrix, it is the 4 by 4 identity matrix. An identity matrix is a matrix that, if you multiply it by matrix M, will result in exactly matrix M. So in terms of 3d transformations, this matrix is a null-transformation, it does not move points at all. All square matrices with 1's on the diagonal and 0's elsewhere are identity matrices.

Matrix multiplication is quite messy for those who've never seen it before. Let's start by multiplying two 2 by 2 matrices.

$M_1 = \begin{bmatrix} 1 & 2 \\ 0 & 3 \\ \end{bmatrix}$

$M_2 = \begin{bmatrix} 1 & 2 \\ 0 & 1 \\ \end{bmatrix}$

$M_1 \times M_2 = \begin{bmatrix} 1 & 4 \\ 0 & 3 \\ \end{bmatrix}$

So how did I arrive at that result? The number at row r and column c in the resulting matrix is the result of taking the values in row r of the first matrix (M₁) and those in column c in the second matrix (M₂) and multiplying those values one at a time, adding the results together.

That last sentence was a little vague, so I'll give an example. The top left number of the result matrix is 1, this was obtained by taking row 1 from M₁ ([ 1 2 ]) and column 1 from M₂ ([ 1 0 ]), then we take the first elements (1 and 1) and multiply those (resulting in 1), to this we add the result of multiplying the second pair of numbers (2 and 0), but since that result is 0 the value remains 1. The same way, the 3 in the bottom right of the result matrix is arrived at by taking [ 0 3 ] (row 2 from M₁) and [ 2 1 ] (column 2 from M₂): 0 * 2 + 3 * 1 = 3.

An important thing to notice is that M₁ * M₂ does not equal M₂ * M₁:

$M_2 \times M_1 = \begin{bmatrix} 1 & 8 \\ 0 & 3 \\ \end{bmatrix}$

When you multiply matrices with different sizes two things apply:

The width of the first matrix has to be equal to the height of the second.
The resulting matrix has the height of the first matrix and the width of the second.

$\begin{bmatrix} 1 & 10 & 2 & 1 \\ \end{bmatrix} \times \begin{bmatrix} 1 & 0 & 0 & 0 \\ 0 & 1 & 0 & 0 \\ 0 & 0 & 1 & 0 \\ 2 & 2 & 2 & 1 \\ \end{bmatrix} = \begin{bmatrix} 3 & 12 & 4 & 1 \\ \end{bmatrix}$

The fact that a 4 by 1 and a 4 by 4 matrix were used here is no accident, they are the only shapes needed for basic 3d transformations. The first matrix represents a point, in the form [ x y z 1 ], the 1 in the last row is needed to transform points this way, it should remain 1 when regular transforms are applied.

The matrix used here is the matrix that represents the translation by the vector (2 2 2). Notice that it is the identity matrix, except that three 2's have been added in the bottom row. Also note that the resulting matrix is indeed the matrix that represents the point (1 10 2) translated by (2 2 2).

One thing to notice is that the convention I'm using here is not universal. Instead of putting the translation stuff in the bottom row, you can also put it in the rightmost column. If you do that you have to multiply stuff the other way round (Matrix * Vector instead of Vector * Matrix). All other transform matrices are also the transposed versions of the ones I show below. (Transposed means they are flipped around their diagonal, the rows and columns are switched, something in row x, column y ends up in row y, column x.)

[edit]

Combining matrices

If we take the translation matrix used in the previous example and multiply it by itself:

$\begin{bmatrix} 1 & 0 & 0 & 0 \\ 0 & 1 & 0 & 0 \\ 0 & 0 & 1 & 0 \\ 2 & 2 & 2 & 1 \\ \end{bmatrix} \times \begin{bmatrix} 1 & 0 & 0 & 0 \\ 0 & 1 & 0 & 0 \\ 0 & 0 & 1 & 0 \\ 2 & 2 & 2 & 1 \\ \end{bmatrix} = \begin{bmatrix} 1 & 0 & 0 & 0 \\ 0 & 1 & 0 & 0 \\ 0 & 0 & 1 & 0 \\ 4 & 4 & 4 & 1 \end{bmatrix}$

We arrive at a matrix that does a translation of (4 4 4), which is exactly what you'd expect the result of combining two (2 2 2) translations to be. I recommend doing some of these matrix multiplication by hand, just to get a feel for their logic. Of course, in the end it is a good thing that we have computers to do this kind of mind numbing stuff for us.

Now, in a 3D program (or library) you'll usually be dealing with two or more matrices that contain the current transformation. For example, in OpenGL there are two important matrices, the projection matrix and the view matrix. The first one contains the transformation of points to screen coordinates, including perspective and such. This can get complex and will be ignored here. The other one is the one you'll be manipulating while you use the library. The transformation specified by this matrix will be applied to every point that is sent to the library.

When this matrix is the identity matrix, points are not transformed and the world is oriented in some default position (for OpenGL this means the camera is at (0 0 0) looking down the Z-axis. The trick is to put the position of the camera into the view matrix. If you put a translation of (0 0 -10) in it, it will be as though the camera was raised by 10 units. In fact, everything that gets drawn is moved down by 10 units.

When the camera transform is set, you can also use the view matrix to transform individual object. You can just add another transform on top of the camera transform before drawing the object. Note that this will clobber the matrix and when you draw another object you'll want to undo the transformations that were specific to the previous object, but not those that position the camera. There is usually a possibility to 'push' and 'pop' matrices off a stack for this purpose.

Exactly how chained transformations interact with each other requires some experience to get used to. For example, first rotating something and then translating it gives a different effect than doing it the other way around. The OpenGL programming guide explains this pretty well in chapter 3.Ask Devesh Mittal

[edit]

Transformations

So far I've only shown translation matrices. To repeat that, a translation matrix contains the X, Y and Z distances in the first 3 elements of the bottom row, and is the identity matrix apart from that:

$\begin{bmatrix} 1 & 0 & 0 & 0 \\ 0 & 1 & 0 & 0 \\ 0 & 0 & 1 & 0 \\ X & Y & Z & 1 \end{bmatrix}$

Another simple one is scaling, X, Y and Z are the factors by which the points are scaled along the x, y, and z-axis. If they have the same value proportions are kept intact. With negative values you can also mirror points this way.

$\begin{bmatrix} X & 0 & 0 & 0 \\ 0 & Y & 0 & 0 \\ 0 & 0 & Z & 0 \\ 0 & 0 & 0 & 1 \\ \end{bmatrix}$

Then we get to rotation. Rotation has two properties, an angle and an axis around which you are rotating. Rotation around the x, y and z-axis is simple. α indicates the angle here.

X-axis:	Y-axis:	Z-axis:
$\begin{bmatrix} 1 & 0 & 0 & 0 \\ 0 & \cos\alpha & -\sin\alpha & 0 \\ 0 & sin\alpha & \cos\alpha & 0 \\ 0 & 0 & 0 & 1 \\ \end{bmatrix}$	$\begin{bmatrix} \cos\alpha & 0 & \sin\alpha & 0 \\ 0 & 1 & 0 & 0 \\ -\sin\alpha & 0 & \cos\alpha & 0 \\ 0 & 0 & 0 & 1 \\ \end{bmatrix}$	$\begin{bmatrix} \cos\alpha & -\sin\alpha & 0 & 0 \\ \sin\alpha & \cos\alpha & 0 & 0 \\ 0 & 0 & 1 & 0 \\ 0 & 0 & 0 & 1 \\ \end{bmatrix}$