Can anyone recommend some good starting points for understanding Transformation Matrices for dummies like me with poor math skills.
I'm willing to learn the math, and I'm not a complete idiot (I hope) but the examples I'm finding seem to require a huge leap from what I know, to what I need to know.
We can use matrices to translate our figure, if we want to translate the figure x+3 and y+2 we simply add 3 to each x-coordinate and 2 to each y-coordinate. If we want to dilate a figure we simply multiply each x- and y-coordinate with the scale factor we want to dilate with.
In a composite transformation, the order of individual transformations is important. For example, if you first rotate, then scale, then translate, you get a different result than if you first translate, then rotate, then scale.
A transformation matrix allows to alter the default coordinate system and map the original coordinates (x, y) to this new coordinate system: (x', y'). Depending on how we alter the coordinate system we effectively rotate, scale, move (translate) or shear the object this way.
To do this, we must take a look at two unit vectors. With each unit vector, we will imagine how they will be transformed. Then take the two transformed vector, and merged them into a matrix. That matrix will be the transformation matrix.
I wrote a web program that can be used to play around with transformation matrices. It allows preset types and custom ones.
Play with it online or grab the source.
It should be easy to play with the numbers and instantly see how it affects the house drawing. Look at the code available online to determine what it's doing, and you should be able to understand what's going on.
If you're having trouble, realise that the 3×3 matrix is simply being multiplied by each vertex (X & Y coordinate) in the house shape. Matrix multiplication with the vertex (we will now refer to it as a vector) and a transformation matrix looks like so...
1 0 0 1
0 1 0 * 2
0 0 1 0
On the left is an identity matrix (an idempotent matrix that doesn't affect the vector) and a vector of 1, 2, 0 (assume this maps to position X1 and Y2 in the program mentioned above's graph and ignore the final 0
).
Matrix multiplication can be visualised like so...
a b c x a * x + b * y + c * z
d e f + y = d * x + e * y + f * z
g h i z g * x + h * y + i * z
So, in our example, that would be...
1 0 0 1 1 * 1 + 0 * 2 + 0 * 0
0 1 0 * 2 = 0 * 1 + 1 * 2 + 0 * 0
0 0 1 0 0 * 1 + 0 * 2 + 1 * 0
Do that math and we get the final vector...
1
2
0
Since we said our identity matrix shouldn't modify the values, we can see above that that is the case as the resulting vector matched the original.
To explain further, consider when you need to translate the vector. Let's say we want to translate the house by 5
pixels along the X axis. We want to start with the identity matrix, but change the top right number to 5
and make the extra dimension in the vector 1
(you will see why briefly).
1 0 5 1 1 * 1 + 0 * 2 + 5 * 1
0 1 0 * 2 = 0 * 1 + 1 * 2 + 0 * 1
0 0 1 1 0 * 1 + 0 * 2 + 1 * 1
We do the math again...
6
2
1
We can see that the first number (X in our coordinates) has been translated along the X axis by 5
. Try it in the program linked above.
The reason we made the third value 1
is so when the math was performed, the translation was considered. Had it been 0
, it will be ignored, as any number multiplied by 0
results in 0
.
If you're still having trouble, check out videos online (this one, for example) which can help explain it in a more visual fashion.
Remember: pretty much anyone can drive a car, and pretty much anyone can learn this, despite any self-evaluated poor understanding of math. Just keep at it: persistence is key. Good luck.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With