What is a matrix transformation?
A transformation is a rule that moves every point of a shape, and a matrix can be that rule. Graphics and games use matrices to rotate, stretch and flip shapes on a screen.
This lesson shows how to read a matrix as a rotation, a scaling or a flip.
By the end of this lesson
Note
I can read a matrix as a rotation, a scaling or a flip.
Key words
| Word | What it means |
|---|---|
| Transformation | a rule that moves every point |
| Rotation | a turn about the origin |
| Scaling | a stretch or shrink of every length |
| Reflection | a flip across a line |
| Composition | one transformation done after another |
The cells students fill in are left blank in this preview.
Columns say where the axes go
Write a point as a vector, such as [1, 0]. Multiply a 2 x 2 matrix by it and you get a new point.
The first column of the matrix is where [1, 0] lands. The second column is where [0, 1] lands. Every other point moves to match.
Worked example: where the columns send the axes
| Matrix | Where [1, 0] lands | Where [0, 1] lands | What it does |
|---|---|---|---|
| [[1, 0], [0, 1]] | [1, 0] | [0, 1] | Nothing moves |
| [[0, -1], [1, 0]] | [0, 1] | [-1, 0] | A quarter turn anticlockwise |
| [[2, 0], [0, 2]] | [2, 0] | [0, 2] | Every length doubles |
| [[1, 0], [0, -1]] | [1, 0] | [0, -1] | A flip upside down |
The cells students fill in are left blank in this preview.
Turn three points a quarter turn
docker exec jupyter python3 -c "import numpy as np; r = np.array([[0, -1], [1, 0]]); p = np.array([[1, 0, 2], [0, 1, 3]]); print((r @ p).tolist())"Shown here, not run. Create a free account to press Run and type it into your own lab’s terminal.
Many points move in one product
The Run puts three points in one matrix, one point in each column: [1, 0], [0, 1] and [2, 3]. One product moves all three.
It printed [[0, -1, -3], [1, 0, 2]]. Read down the columns: the points are now [0, 1], [-1, 0] and [-3, 2].
Rotation, scaling and reflection each have a pattern
A rotation matrix holds the cosine and sine of the angle. A scaling matrix has the stretch factors on its diagonal. A reflection changes the sign of one coordinate.
Code measures angles in radians. 180 degrees is pi radians, about 3.14159.
Worked example: rotation matrices
| Angle | Matrix | Where [1, 0] lands |
|---|---|---|
| 0 degrees | [[1, 0], [0, 1]] | [1, 0] |
| 90 degrees | [[0, -1], [1, 0]] | [0, 1] |
| 180 degrees | [[-1, 0], [0, -1]] | [-1, 0] |
| 45 degrees | [[0.71, -0.71], [0.71, 0.71]] | [0.71, 0.71] |
The cells students fill in are left blank in this preview.
Scale and flip the same points
docker exec jupyter python3 -c "import numpy as np; s = np.array([[2, 0], [0, 2]]); f = np.array([[1, 0], [0, -1]]); p = np.array([[1, 0, 2], [0, 1, 3]]); print((s @ p).tolist(), (f @ p).tolist())"Shown here, not run. Create a free account to press Run and type it into your own lab’s terminal.
A common mistake
Warning
Many people think a rotation changes how long a vector is. It does not: a turn keeps every length. Turning [3, 4] a quarter turn gives [-4, 3], and both have length 5. Only a scaling changes lengths.
Two transformations in a row multiply their matrices
To do one transformation and then another, multiply their matrices. The one done first goes on the right, next to the point.
Turning first and then doubling is S times R, where R is the turn and S is the scaling. Applied to a point p, that is S times (R times p).
Worked example: the order matters
| Done in this order | Matrix to multiply | Where [1, 0] lands |
|---|---|---|
| Flip, then quarter turn | [[0, 1], [1, 0]] | [0, 1] |
| Quarter turn, then flip | [[0, -1], [-1, 0]] | [0, -1] |
| Quarter turn, then double | [[0, -2], [2, 0]] | [0, 2] |
The cells students fill in are left blank in this preview.
Compose two transformations both ways
docker exec jupyter python3 -c "import numpy as np; r = np.array([[0, -1], [1, 0]]); f = np.array([[1, 0], [0, -1]]); print((r @ f).tolist(), (f @ r).tolist())"Shown here, not run. Create a free account to press Run and type it into your own lab’s terminal.
Apply a matrix to points in Python
# Turn the corners of a square a quarter turn.
def apply(m, point):
x = m[0][0] * point[0] + m[0][1] * point[1]
y = m[1][0] * point[0] + m[1][1] * point[1]
return [x, y]
quarter_turn = [[0, -1], [1, 0]]
square = [[0, 0], [1, 0], [1, 1], [0, 1]]
for corner in square:
print(apply(quarter_turn, corner))
# Change the matrix to [[2, 0], [0, 2]] and predict the new corners.
Going further
In your own notebook, write the matrix for a turn of 30 degrees with np.cos and np.sin. Remember that both take radians.
Turn the corners of a square with it, and check with np.linalg.norm that the corner [1, 1] keeps its length.