A matrix is a rectangular arrangement
of data. In most cases the data in a matrix is
a series of numbers in a specific order used
to store information about an object.
A matrix can be considered a single entity in
itself and is conventionally described by
its dimentions (ie the number of rows and columns
it contains). This is a 2x3 matrix as it contains
two rows and three columns:
Each number that makes
up a matrix is called an element and has a specific
address or reference. Typically an element in
a matrix is referenced by writing row and column
coordinate as a subscript for example for the
matrix A each element can be written:
There are specific rules
and procedures used to manipulate matrices for
example simple operations such as addition or
multiplication of two matrices must follow specific
rules which dictate how to treat each element
of each matrix in order to find the result.
A matrix can be created in flash using a one
dimentional array as arrays has the ability to
contain all the element values in a specific
order and allow each one to be reference individually.
var my_matrix = new Array (2,5,6,7,8,4);
In flash an arrya can
be defined over multiple lines so a common
way to distingush a matrix that is encoded
into an array is to spread out the definition
on to different lines each one representing
a "row". This is just for clarity
and has not function in the code itself.
var my_matrix = new Array
(2,5,6,
7,8,4);
or using another notation
var my_matrix = new Array();
my_matrix [0] = 2;
my_matrix [1] = 5;
my_matrix [2] = 6;
my_matrix [3] = 7;
my_matrix [4] = 8;
my_matrix [5] = 4;
Since we are aiming for convinience
and efficiencey rather than prodicing a mathematically
true matrix in actionscript we can make the "matrix"
fit into an even shorter 1d array by putting
more than one matrix element value into each
array element. e.g.
var my_matrix = new Array();
my_matrix [0] = [2 ,5 ,6];
my_matrix [1] = [7, 8, 4];
This is perhaps the cleanest
way to describe a 2x3 matrix using a 1d array
in actionscript while still being able to reference
each element easily.
var my_matrix = new Array();
my_matrix [0] = {a:2 ,b:5 ,c:6};
my_matrix [1] = {a:7, b:8, c:4};
Other ways which are more "mathematical" store
matrices in 2d arrays. This is approach is more
consistent as after all in mathematics
matrices are a special type of array
extressed in two dimentions. To create 2d and
other multidimentional arrays in actionscript.
You must create sets of nested arrays for example:
var name_of_2d_array:Array =
new Array (New Array ("value1","value2"),
New Array ("value3","value4"));
Another syntax that can be used which has the
same effect is the individual assignment of a
value to each element in the multidimentional
array.
var name_of_2d_array:Array =
new Array();
name_of_array[0][0] = "value1";
name_of_array[0][1] = "value2";
name_of_array[1][0]
= "value3";
name_of_array[1][1] = "value4";
Multi-dimentional arrays
can also be created using "for" loops. To learn
more about multi dimentional arrays see [The
Multi-Dimensional Array Knowledgebase].
In matrix addition
each element of the matrix is added to the same
element in the other matrix. For example The
first element of matrix A, A00 is added to the
first element of matrix B , B00 to create the
first element of the resulting matrix C, C00.
Matrix A plus Matrix B:
Adding matrices using actionscript
To learn more about adding
matrices see [Matrix
Addition Knowledgebase].
Matrix
subtraction subtraction
is similar to addition;
each element of the second
matrix is subtracted from
the same element in the
first matrix. For example
The first element of
matrix B, B00 is subtracted
from the first element
of matrix A , A00 to create
the first element of the
resulting matrix C, C00.
Matrix A minus Matrix B:
Subtracting matrices using actionscript
To learn more about subtracting
matrices see [Matrix Subtraction
Knowledgebase].
When a matrix is multiplied by a constant (also
known as a scalar) each element of the matrix
is multiplied by the constant to create the resultant
matrix.
Matrix B multiplied by the scalar a:
Multiplying a matrix by a constant using actionscript
To learn more about multiplying
matricies by a constant see [Multiplying
A Matrix By A Constant Knowledgebase].
Multiplying two matrices together is more complex
addition, subtraction or scalar multiplication.
When matrices are multiplied together each element
must be multiplied by a specifc element in the
other matrix Then specific copmbinations of
these results are added together to create a
single element in the resulting matrix.
The pattern of multiplication
and addition that this creates is very specific
and creates a characteristic result. This makes
matrix multiplication stand out from the multiplication
of other familiar entities as scalars and vectors.
To multiply matrix A by matrix B each element
must be treated differently accoording to a
set pattern. To find the first element of the
resulting matix C, C00 each element in the first
row of matrix A must be multiplied by an element
in the first column of the matrix B in order.
The total of each of these products is then
found giving the value of the first element
in the resulting matrix C.
For example:
- The first element in the first
row of matrix A is multiplied by the first element in the first column of B (A00xB00).
- Then the
second element in the first row of A is multiplied
by the second element in the first column of
B (A01xB10).
- The third and
final element of the first row of
A is multiplied by the third element in the
first column of
B (A02xB20).
- The sum of these
products is calculated to give the first element
of the of matrix C (C00 = (A00xB00)+(A01xB10)+(A02xB20)).
Matrix A multiplied by Matrix B:
Mutliplying two matricies using actionscript
To learn more about matrix
multiplication see [Matrix Multiplication
Knowledgebase].
The rules which govern
how elements in matrices behave give rise to
unique behvours and characteristics. In many
cases these characteristics can be used to simplifiy
multi-step operations in algebra by creating
a predictable structure of manipulation which
can be elegantly manipulated using matrix operations.
With vector manipulation x and y cordinates of
a object can be stored in a matrix so the matrix
acts to describe the object. This matrix can
then be multiplied by another matrix call and
operator which will modify its perperties in
a predicatble way creating a resulting matrix
with a new modified description of the original
object.
For example:
All the matrix does is
provide the mechanism in which to calculate a
set of results. However this mechanism can be
used to produce a variety of effects on the properties
of objects in space such as translation, reflection,
rotation and distortion.
Multiplying 3D coordinates by the identity matrix:
How to reflect a shape using matrices and actionscript
To learn more about the identity matrix see [Identity
Matrix Knowledegbase].
Reflecting an object in the y axis:
How to reflect a shape using matrices and actionscript
To learn more about the reflection matrix see [Matrix
Reflection Knowledegbase].
(affline
transformations)
Stretch a shape along the y axis
How to stretch an object using matrices and actionscript:
To learn more about matrix distortion see [Matrix
Skew Knowledegbase] and [Matrix Scale Knowledegbase].
Translating an object in 2d space:
How to move an object using matrices and actionscript
To learn more about the
translation matrix seee [Matrix
Translation Knowledegbase].
Rotating a shape about the z axis:
How to rotate an object using matrices and actionscript
To learn more about the rotation matrix
see [Matrix
Rotation Knowledegbase].
The transfomation matrix
is a fusion of multiple different matrix operations.
It can translate, scale, rotate and skew a
movie clip with one operation. In this way
it can vastly simplify calculations involving
multiple operations and organize calculations
involving multiple coordinates. Instead of
having to perform seperate calcualtions on
a set of points the transformation matrix can
be used to perform them all at the same time.
This makes a very versatile matrix operator
so in flash the "transform" matrix
has its own class.
This matrix operator
represents what is "under the hood" of
the transform matrix class in flash.
 |
|
- a and d can
be adjusted to scale or reflect a movie
clip.
- c and b can
be used tovertically or horizontall skew
a movie clip.
- a,b,c and d can
be used together to rotate amovie clip.
- tx and
and ty are used to translate
the position of the movie clip on stage.
|
*u,v and w cannot
be accessed in the transform matrix class.
An alternative representation
of this matrix can be found that has the same
elements but with thier positions flipped.
This matrix performs the same operations but
when used to manipulated points it requires
a slighlty different calcualtion set up (using
row vectors instead of column vectors). However
the results are the same as the orientation
of the elements in an operation matrix is ultimately
not important (the relative position is).
Traditionally in computer
graphics and modeling u v and w have been used
to perfrom extra graphical transformations
however in flash the transformation matrix
class can only perate in 2d space so the values
of u and v are au6tomatically set to zero and
the value of w is set to one.
It is in this form that
the transform matrix is most often shown in
flash (in the flash help pages).
In flash the transform
matrix is used as a generic to perform generic
transformation or combinations of transformation
at the same time. If a user wants to perform
a specific operation they could use a modified
form of the tranformation matrix or use a
selected
"method" of the matrix transform
class. For example:
translate(tx:Number, ty:Number):Void
scale(sx:Number, sy:Number):Void
rotate(angle:Number):Void
identity():Void
Using these methods selected
operations can be performed such as translation,
rotation, scale or reflection without the need
to work directly with matrices.
Note: In
Actionscript 2.0 there is no skew method available
for the matrix transform class.
Matrices can also be used to manipulate other
properties of objects in flash:
Editing alpha channel only
Changing the blue chanel
Changing the green channel
Changing the red channel
import flash.filters.ColorMatrixFilter;
var my_matrix:Array = [ 1,0,0,0,0,
0,2,0,0,0,
0,0,1,0,0,
0,0,0,1,0
];
var my_colorMatrix:ColorMatrixFilter
= new ColorMatrixFilter(My_matrix);
my_mc.filters =
[my_colorMatrix];
Bluring an image
Sharpening an image
Embossing effect
import flash.filters.ConvolutionFilter;
var my_matrix:Array = [ 1,0,1,
0,1,0,
1,0,1
];
var my_convMatrix:ConvolutionFilter
= new ConvolutionFilter(3,3,my_matrix);
my_mc.filters
= [my_convMatrix];
pass the matrix along with
the number of rows and columns into the convolution
matrix constructor.
The Determinant Of A Matrix
The Inverse Of A Matrix
Matrix tranformation of 3D points
