2D Rotation

Rotation is the transformation that turns an object about a fixed point by a certain angle, without altering its size or shape. 

In 2D computer graphics, rotation always happens about a single point typically the origin, or a chosen pivot point making it conceptually simpler than 3D rotation (which requires specifying an entire axis).

What is Rotation?

Rotation is a transformation that turns every point of an object about a fixed point (called the pivot or center of rotation) by a specified angle θ. 

As the object rotates, every point traces a circular arc around the pivot, and the distance from each point to the pivot remains constant throughout the transformation.

By convention, a positive angle θ represents counter-clockwise rotation, while a negative angle θ represents clockwise rotation (this follows the standard mathematical convention used on the Cartesian plane).

Derivation of the Rotation Formula

Consider a point P(x, y) located at a distance r from the origin, making an angle φ with the positive X-axis. Then:

x = r cosφ
y = r sinφ

If this point is rotated by an additional angle θ, its new angle from the X-axis becomes (φ + θ), so the new coordinates are:

x' = r cos(φ + θ)
y' = r sin(φ + θ)

Using the trigonometric addition formulas:

cos(φ + θ) = cosφ cosθ - sinφ sinθ
sin(φ + θ) = sinφ cosθ + cosφ sinθ

Substituting x = r cosφ and y = r sinφ:

x' = r cosφ cosθ - r sinφ sinθ = x cosθ - y sinθ
y' = r sinφ cosθ + r cosφ sinθ = x sinθ + y cosθ

This gives the final 2D rotation formula (rotation about the origin):

x' = x cosθ - y sinθ
y' = x sinθ + y cosθ

The Rotation Matrix

Using homogeneous coordinates, the 2D rotation matrix (about the origin) is a 3×3 matrix:

R(θ) = | cosθ  -sinθ   0 |
       | sinθ   cosθ   0 |
       |  0      0     1 |

Applying this to a point P(x, y, 1):

| x' |   | cosθ  -sinθ   0 | | x |
| y' | = | sinθ   cosθ   0 | | y |
| 1  |   |  0      0     1 | | 1 |

Expanding confirms it matches the derived formula:

x' = (cosθ)(x) + (-sinθ)(y) + (0)(1) = x cosθ - y sinθ
y' = (sinθ)(x) + (cosθ)(y) + (0)(1) = x sinθ + y cosθ

Geometric Interpretation

Rotation about the origin spins an object around the point (0, 0) like a hand on a clock. Geometrically:

• The distance of every point from the pivot remains constant.
• Angles and shapes within the object are preserved.
• Only the object's orientation and position relative to the pivot change.

Because rotation preserves distances and angles, it is classified as a rigid-body transformation (an isometry), just like translation.

Properties of 2D Rotation

1. Identity case: When θ = 0°, the rotation matrix reduces to the identity matrix, leaving the object unchanged.

2. Inverse rotation: The inverse of a rotation by θ is a rotation by -θ:

   R^-1(θ) = R(-θ)

   Geometrically, rotating clockwise by the same angle undoes a counter-clockwise rotation.

3. Orthogonality: The rotation matrix is orthogonal, meaning its inverse equals its transpose:

   R^-1(θ) = R(θ)^T

   This is a useful computational shortcut instead of computing a matrix inverse, you can simply transpose the matrix.

4. Composition (combining two rotations): Applying two rotations in sequence about the same pivot is equivalent to a single rotation by the sum of the angles:

   R(θ1) · R(θ2) = R(θ1 + θ2)

5. Commutativity: Unlike 3D rotation, 2D rotations about the same point always commute, since there's only one possible rotation plane:

   R(θ1) · R(θ2) = R(θ2) · R(θ1)
   

6. Determinant: The determinant of a 2D rotation matrix is always +1, confirming it preserves area and does not include any reflection.
7. Periodicity: Since rotation is based on sine and cosine, R(θ) = R(θ + 360°) — rotating by an angle plus any full multiple of 360° produces the same result.

Rotation about an Arbitrary Pivot Point

Rotation about the origin is a special case. In most practical situations rotating a shape about its own center, or about a user-selected point on screen the pivot point P(px, py) is not the origin. 

To rotate about an arbitrary pivot, the same "translate–transform–translate back" technique used for scaling is applied:

Procedure

1. Translate the pivot point to the origin: T(-p_x, -p_y)
2. Rotate about the origin by angle θ: R(θ)
3. Translate back to the original pivot location: T(p_x, p_y)

Combined Matrix

R' = T(px, py) · R(θ) · T(-px, -py)

Expanded Form

Carrying out the matrix multiplication gives the direct formulas for rotating a point (x, y) about pivot (p_x, p_y):

x' = px + (x - px) cosθ - (y - py) sinθ
y' = py + (x - px) sinθ + (y - py) cosθ

This makes intuitive sense: the point's position is first measured relative to the pivot (x - px, y - py), rotated using the standard formula, and then shifted back by adding the pivot coordinates.

Solved Numerical Problems

Problem 1

Rotate the point P(1, 0) by 90° about the origin. Find the new coordinates.

Solution:

θ = 90°, cos90° = 0, sin90° = 1
x' = x cosθ - y sinθ = 1(0) - 0(1) = 0
y' = x sinθ + y cosθ = 1(1) + 0(0) = 1

New point P' = (0, 1)

This confirms the expected result: rotating a point on the positive X-axis by 90° counter-clockwise lands it on the positive Y-axis.

Problem 2

Rotate the point P(2, 3) by 180° about the origin. Find the new coordinates.

Solution:

θ = 180°, cos180° = -1, sin180° = 0
x' = x cosθ - y sinθ = 2(-1) - 3(0) = -2
y' = x sinθ + y cosθ = 2(0) + 3(-1) = -3

New point P' = (-2, -3)

This confirms that a 180° rotation simply negates both coordinates — the point ends up diametrically opposite the origin.

Problem 3

Rotate the point P(4, 0) by 60° about the origin. Find the new coordinates (use cos60° = 0.5, sin60° = 0.866).

Solution:

x' = x cosθ - y sinθ = 4(0.5) - 0(0.866) = 2
y' = x sinθ + y cosθ = 4(0.866) + 0(0.5) = 3.464

New point P' = (2, 3.464)

Problem 4

A point P(3, 4) is rotated by 90° about the origin. Verify that the distance from the origin remains unchanged after rotation.

Solution:

Original distance from origin:

d = √(3² + 4²) = √25 = 5

Rotation (cos90° = 0, sin90° = 1):

x' = 3(0) - 4(1) = -4
y' = 3(1) + 4(0) = 3

New point P' = (-4, 3)

New distance from origin:

d' = √((-4)² + 3²) = √25 = 5

Distance is unchanged (5 units), confirming rotation preserves distance from the pivot.

Problem 5

Rotate the point P(5, 5) by 45° about the pivot point F(2, 2), instead of the origin (use cos45° = sin45° = 0.7071).

Solution:

Step 1: Find position relative to the pivot:

(x - px) = 5 - 2 = 3
(y - py) = 5 - 2 = 3

Step 2: Apply the rotation formulas about the pivot:

x' = px + (x-px)cosθ - (y-py)sinθ = 2 + 3(0.7071) - 3(0.7071) = 2 + 2.1213 - 2.1213 = 2
y' = py + (x-px)sinθ + (y-py)cosθ = 2 + 3(0.7071) + 3(0.7071) = 2 + 2.1213 + 2.1213 = 6.2426

New point P' = (2, 6.2426)

Problem 6 (Practice try it yourself)

A square has vertices A(1, 1), B(3, 1), C(3, 3), and D(1, 3). Rotate the square by 90° about its own center (2, 2). Find the new coordinates of all four vertices, and verify that the side length AB remains unchanged after rotation.

(Hint: use the arbitrary pivot rotation formulas with px = 2, py = 2, θ = 90°, and recompute the distance between the new A' and B'.)

Conclusion

2D rotation builds directly on the foundation laid by translation, introducing trigonometric relationships to describe circular motion about a fixed point.

Understanding the standard rotation matrix about the origin and the "translate–rotate–translate back" technique for rotating about an arbitrary pivot prepares you well for the added complexity of 3D rotation, where rotation must also account for a chosen axis in space.