Homogeneous Coordinates for Graphics Transformations

Why Add a Third Coordinate?

A two-dimensional point is usually recorded as a pair \((x,y)\). A rotation, scaling, or shear about the origin can be written as a \(2\times2\) matrix acting on the column \(\begin{bmatrix}x\\y\end{bmatrix}\). A translation is different: it adds a fixed vector, such as \(\begin{bmatrix}a\\b\end{bmatrix}\), rather than multiplying the point by a \(2\times2\) matrix. Homogeneous coordinates give translations and the other transformations a common matrix representation. That makes each one usable in the same matrix-based graphics workflow.

Throughout, points lie in \(\mathbb{R}^2\), and their coordinates are columns. We represent a point \((x,y)\) by appending a third coordinate equal to \(1\). This extra coordinate is not a new spatial direction: for the transformations studied here, the first two entries give the plane coordinates and the last entry remains \(1\).

The convention of using columns determines where the entries go in a transformation matrix. We multiply the matrix on the left of the homogeneous-coordinate column. Translation terms therefore appear in the last column, while the upper-left \(2\times2\) block describes how the original \(x\)- and \(y\)-coordinates contribute to the new coordinates.

Translation as a Matrix

A translation by \((a,b)\) sends \((x,y)\) to \((x+a,y+b)\). In ordinary two-coordinate form, this requires addition. In homogeneous coordinates, the constant terms can instead multiply the final coordinate, which equals \(1\): \(a\cdot1=a\) and \(b\cdot1=b\).

Rotations, Scalings, and Shears

A transformation that is already given by a \(2\times2\) matrix \(\mathbf{A}\) can be placed in the upper-left corner of a \(3\times3\) homogeneous-coordinate matrix. The final row \(\begin{bmatrix}0&0&1\end{bmatrix}\) keeps the last coordinate equal to \(1\). For a counterclockwise rotation about the origin by angle \(\theta\), the \(2\times2\) matrix is \(\begin{bmatrix}\cos\theta&-\sin\theta\\\sin\theta&\cos\theta\end{bmatrix}\).

A scaling changes distances from the origin along the coordinate directions. Horizontal and vertical scaling factors need not be equal. A factor of \(0\) collapses that coordinate to zero; a negative factor also reflects that coordinate across the origin.

A shear changes one coordinate by an amount proportional to the other, while leaving the other coordinate unchanged. The name of the shear must be read from its coordinate rule: a horizontal shear changes \(x\), whereas a vertical shear changes \(y\).

Why the Homogeneous Matrix Form Works

The common structure can be stated for any affine rule on the plane. Here an affine map means a function \(T:\mathbb{R}^2\to\mathbb{R}^2\) of the form \(T(\mathbf{x})=\mathbf{A}\mathbf{x}+\mathbf{t}\), where \(\mathbf{A}\in\mathbb{R}^{2\times2}\), \(\mathbf{t}\in\mathbb{R}^2\), and \(\mathbf{x}=\begin{bmatrix}x\\y\end{bmatrix}\). This description includes the translations and the origin-centred linear transformations defined above.

Proof. Write \(\mathbf{A}=\begin{bmatrix}a_{11}&a_{12}\\a_{21}&a_{22}\end{bmatrix}\). Multiplying the block matrix by the homogeneous-coordinate vector gives \(\begin{bmatrix}a_{11}x+a_{12}y+a\\a_{21}x+a_{22}y+b\\1\end{bmatrix}\). Its first two entries are exactly \(\mathbf{A}\mathbf{x}+\mathbf{t}=T(\mathbf{x})\), and its last entry is \(1\). This proves that the displayed matrix represents \(T\). To prove uniqueness within this block form, suppose another such matrix has upper-left block \(\mathbf{B}\) and last column’s first two entries \(\mathbf{s}\), and represents the same \(T\) for every \(\mathbf{x}\). At \(\mathbf{x}=\begin{bmatrix}0\\0\end{bmatrix}\), equality gives \(\mathbf{s}=\mathbf{t}\). At \(\mathbf{x}=\begin{bmatrix}1\\0\end{bmatrix}\), equality gives \(\mathbf{B}\begin{bmatrix}1\\0\end{bmatrix}+\mathbf{t}=\mathbf{A}\begin{bmatrix}1\\0\end{bmatrix}+\mathbf{t}\), so the first columns of \(\mathbf{B}\) and \(\mathbf{A}\) agree. At \(\mathbf{x}=\begin{bmatrix}0\\1\end{bmatrix}\), the same equality shows their second columns agree. Thus \(\mathbf{B}=\mathbf{A}\), \(\mathbf{s}=\mathbf{t}\), and the matrices are identical. \(\square\)

This result explains the placement of the entries. The upper-left block supplies the linear coordinate changes, the last column supplies constant shifts, and the final row keeps the homogeneous coordinate equal to \(1\). A translation has \(\mathbf{A}=\mathbf{I}_2\); a rotation, scaling, or shear about the origin has \(\mathbf{t}=\mathbf{0}\). These are different choices within the same matrix form.

Common Mistake: Treating Translation as a Two-by-Two Product

A frequent error is to try to translate a point by multiplying only its two-coordinate column by the \(2\times2\) identity matrix. For example, applying \(\mathbf{I}_2\) to \(\begin{bmatrix}2\\-1\end{bmatrix}\) gives \(\begin{bmatrix}2\\-1\end{bmatrix}\), not the translation of \((2,-1)\) by \((3,4)\). The identity matrix leaves the point unchanged; it has no entries that can add \(3\) and \(4\).

The correction is to use the homogeneous-coordinate vector and put the translation in the last column:

The result represents \((5,3)\), which also follows by adding the translation vector to the original coordinates. Another error is to put \(a\) and \(b\) in the final row. For the column convention used here, those entries must be in the last column: the matrix product shows exactly where each contribution to the output coordinates comes from.

These matrices are useful because a point remains a column vector throughout the calculation, and each transformation has a concrete \(3\times3\) representation. The final coordinate also gives a quick check: for every translation, rotation, scaling, or shear defined here, an input with final coordinate \(1\) must have output final coordinate \(1\). If it does not, either the matrix or the multiplication has been entered incorrectly.