Matrices and matrix multiplication

Matrices come in many forms: row, column, rectangular, square, diagonal, and so forth.. For the purposes of this article, we are only concerned with two types: the row and square matrices.

A row matrix is essentially just a one-dimensional array. As we build our 3D engine, we will use row matrices to store the X, Y and Z coordinate information of points in a 3D space. Mathematically speaking, a row matrix looks like:

A = | a1, a2, a3 |

A square matrix can be thought of as a two-dimensional array (an array of arrays) or a grid of numbers. The square matrix will be used to store rotation information in our engine. In mathematical notation, a square matrix looks like:

B = | b11, b12, b13 |
       | b21, b22, b23 |
       | b31, b32, b33 |

Matrices, both row and square, can be multiplied together. When we multiply two matrices together, we are creating a new matrix that is the rotation of one matrix by the other. We will use this fact to generate a set of equations for our engine that rotates our objects in 3D space. These equations will appear in the MatrixMatrixMultiply() and MatrixVectorMultiply() functions described later in this article.

Creating rotation matrices
To create the 3D rotations, we can choose from a number of standard rotation matrices. For example, we might choose to use the following matrix, which performs a rotation about the X-axis:

Tx  =   |  1,           0,           0     |
           |  0,  -cos(T),   sin(T)   |
           |  0,    sin(T),   cos(T)  |

Or we might choose to use the Y-axis or Z-axis rotation matrices, which follow a similar format. Unfortunately, these matrices won’t fill the needs required by our 3D engine. Since we will be building interactivity into our engine, we will need some way to rotate our objects about an arbitrary axis defined by the users’ mouse. For such a situation, we will use the following matrix:

Txyz  =   |   tan(T)*x*x+cos(T),     tan(T)*x*y-sin(T)*z,    tan(T)*x*z+sin(T)*y   |
               |   tan(T)*x*y+sin(T)*z,  tan(T)*y*y+cos(T),      tan(T)*y*z-sin(T)*x    |
               |   tan(T)*x*z-sin(T)*y,   tan(T)*y*z+sin(T)*x,    tan(T)*z*z+cos(T)     |

This matrix is actually a combination of all three X-axis, Y-axis, and Z-axis rotation matrices, and will allow us to perform any one of the coordinate axis rotations or any other arbitrary axis rotation. We will use this matrix in the SetTransformMatrix() function described in a later section.
Don’t worry about what the variables mean at this point, it’s only important that you see the form of the matrix.

Projection and perspective
Since the computer monitor is limited to displaying 2D images, we have to ‘flatten’ our 3D objects onto the 2D plane of our monitor using a projection. But, because we are use to seeing the world with depth, the flattened image will look odd to us. To correct for the difference between 2D and 3D, we have take into account the effect created by perspective. We’ll do this by multiplying the coordinates of the 3D objects by the following perspective matrix:

         |   f /Z 0 0 |
P  =  |  0 f/  Z 0 |
         |  0 0 1/Z  |

In this matrix, f stands for the perspective constant and can be any number greater than zero. Large values result in flatter images, while small values result in a dramatic perspective. From this matrix we can generate the following set of equations:

X’  =  f*X/Z
Y’  =  f*Y/Z

These equations will be used in the RenderScene() function described in the 3D ActionScript section. You will also see the variable f appear in the initMovie() function where it will play the same role as described in the perspective matrix.

Next, we’ll discuss the process of dynamic drawing in Macromedia Flash.