Dybuk Soft

In this tutorial I assume you are already familiar with basic Matrix computation. If you are not familiar then you can read my tutorial "Matrix basic operations."

For 2D operation we will use 3 values x, y, w this will allow us to do translations, scaling, rotations of point in 2D space. This type of representation is called Homogeneuos, this mean one 2D point can be described by infinite number of groups (x, y, w)

When w is equal 1.0 this is called "normalized" point, this will be our default value.

When w is equal 0.0 this is vector not point

When w is not equal 0.0 or 1.0, this is scaled point to normalize it we will simply divide all coords by w value

Example :

(4, 8, -2, 2) => (4 / 2, 8 / 2, -2 / 2, 2 / 2) => (2, 4, -1, 1)

Since our vector is 3x1 we will create matrix 3x3 that will be used to modify our vector :

Xx | Xy | Xw |

Yx | Yy | Yw |

Wx | Wy | Ww |

*

Vx |

Vy |

Vw |

=

Xx * Vx + Xy * Vy + Xw * Vw |

Yx * Vx + Yy * Vy + Yw * Vw |

Wx * Vx + Wy * Vy + Ww * Vw |

Every i-th coord of destination vector is combination of all source vector coords and one matrix i-th row. At this point we are able to create matrix formulas for translation, rotation, scaling etc.

Lets assume we have source point S and we wont to translate it by vector T our result is point D. This can be described by vector formula:

D = S + T

We will split it into coords :

Dx = Sx + Tx Dy = Sy + Ty

We know that Dx and Dy can be described by matrix formula, we swap V point with S(Sx, Sy, 1)

Xx * Sx + Xy * Sy + Xw * 1 = Sx + Tx Yx * Sx + Yy * Sy + Yw * 1 = Sy + Ty Wx * Sx + Wy * Sy + Ww * 1 = 1

It's easy to spot that when: a) Xx = 1, Xy = 0, Xw = Tx first formula will be equal b) Yx = 0, Xy = 1, Xw = Tx second formula will be equal c) Wx = 0, Wy = 0, Ww = 1 third formula will be equal

Now we can put this values into matrix :

1 | 0 | Tx |

0 | 1 | Ty |

0 | 0 | 1 |

This is our translation matrix. Every point multiply by this matrix will be moved by T vector.

Lets assume we have source point P and we wont to scale it on X axis by Sx, and on Y axis by Sy. We can put it into formula:

Dx = Px * Sx Dy = Py * Sy

Putting it into matrix formula

Xx * Px + Xy * Py + Xw * 1 = Px * Sx Yx * Px + Yy * Py + Yw * 1 = Py * Sy Wx * Px + Wy * Py + Ww * 1 = 1

This formula will be equal when: a) Xx = Sx, Xy = 0, Xw = 0 b) Yx = 0, Xy = Sy, Xw = 0 c) Wx = 0, Wy = 0, Ww = 1

Now we can put this values into matrix :

Sx | 0 | Tx |

0 | Sy | Ty |

0 | 0 | 1 |

This is our scale matrix. Every point multiply by this matrix will be scaled by T vector.

Lets assume we have source point P and we wont to rotate it by alfa angle around point (0,0) this can be described mathematically

Dx = Px * cos(alfa) - Py * sin(alfa) Dy = Px * sin(alfa) + Py * cos(alfa)

Putting it into matrix formula

Xx * Px + Xy * Py + Xw * 1 = Px * cos(alfa) - Py * sin(alfa) Yx * Px + Yy * Py + Yw * 1 = Px * sin(alfa) + Py * cos(alfa) Wx * Px + Wy * Py + Ww * 1 = 1

This formula will be equal when: a) Xx = cos(alfa), Xy = -sin(alfa), Xw = 0 b) Yx = sin(alfa), Xy = cos(alfa), Xw = 0 c) Wx = 0, Wy = 0, Ww = 1

Now we can put this values into matrix :

c_{o,s}(a_{l,f}a) | -s_{i,n}(a_{l,f}a) | 0 |

s_{i,n}(a_{l,f}a) | c_{o,s}(a_{l,f}a) | 0 |

0 | 0 | 1 |

This is our rotation matrix. Every point multiply by this matrix will be rotated around point (0, 0)

Imagine that we wont to rotate point P around point C(x, y). We already know how to rotate it by point (0, 0). We can shift source point by -C, rotate it and then move it back by adding C.

Our operation can be described as :

P' = (-C) * P; P'' = R * P' D = C * P''

Where : R - rotation matrix C - translation matrix to point C

We can combine this into :

D = C * R * (-C) * P

Now instead of calculate each step we can calculate combined matrix M

M = C * R * (-C)

Our destination point D = M * P

**This is huge benefit when we have to do this for lot of points, we can simply calculate matrix just one and reuse it on every point.**

**Any matrix operation can be combined by multiplying, but remember that order is important!**

Matrix can be used to describe new coordinate systems, our initial coordinate system is described by combination of two vectors: X = (1, 0), Y=(0, 1)

When we describe point P as (4, 7) we actually describe it by combination:

4 * (1, 0) + 7 * (0, 1)

We could use different coordinate vectors for example we will pick two points P0 and P1 first one will be position of our camera, and the second one is the place we are looking on. Our Y vector will point exactly on point P0 from P1 so Y = P1 - P0, to have valid coordinate system X should be perpendicular to Y. In two dimensional space vector perpendicular to Y is (Yy, -Yx). For coordinate system our vector need to be normalized (divided by its length)

Our point P in camera space is described by new vectors X,Y :

Px * X + Py * Y

Now lets translate it to space X = (1,0), Y(0, 1). To do that we have to solve :

Px * X + Py * Y = (1, 0) * x' + (0, 1) * y'

We need to calculate x' and y' we will change from vector formula to coordinate formula

Px * X.x + Py * Y.x = 1 * x' Px * X.y + Py * Y.y = 1 * y'

Writing it into matrix formula :

X_{.,x} | Y_{.,x} | 0 |

X_{.,y} | Y_{.,y} | 0 |

0 | 0 | 1 |

*

Px |

Py |

1 |

=

x' |

y' |

1 |

Remember that camera position is P0, so all points need to be shifted after this translation by P0 point.

1 | 0 | P_{0,x} |

0 | 1 | P_{0,y} |

0 | 0 | 1 |

Now we can combine his matrix operations :

X_{.,x} | Y_{.,x} | 0 |

X_{.,y} | Y_{.,y} | 0 |

0 | 0 | 1 |

*

1 | 0 | P_{0,x} |

0 | 1 | P_{0,y} |

0 | 0 | 1 |

=>

X_{.,x} | Y_{.,x} | P_{0,x} |

X_{.,y} | Y_{.,y} | P_{0,y} |

0 | 0 | 1 |

Finally our camera matrix

X_{.,x} | Y_{.,x} | P_{0,x} |

X_{.,y} | Y_{.,y} | P_{0,y} |

0 | 0 | 1 |

(X.x, X.y) - X camera space vector (Y.x, Y.y) - Y camera space vector