# Animating a smooth linear transformation

After watching this video on matrices, I tried to make a simple animation of 2D linear transformations. Starting with a set of 2D points in a grid, I applied a 2x2 matrix to each point and obtained a set of transformed points.

I'm not sure how to animate the transition between the initial and final states. At first, I made each point move along the straight path between its initial and final position. This caused problems for rotation matrices. For example, a 180$^{\circ}$ rotation should show the points rotate about the origin in circular arcs, but my method made it look like the whole grid flipped around, without rotating.

A better rotation animation can be made by applying a very small rotation, say 1$^{\circ}$, multiple times. The matrix for a 1$^{\circ}$ rotation is close to the identity matrix: $$\begin{bmatrix} 0.9998 & -0.0175 \\ 0.0175 & 0.9998 \end{bmatrix}$$

Is there some general formula that can generate a differential transformation matrix, given the full transformation matrix? I would like it to work for any 2x2 matrix, without needing to specify the type of transformation.

• Yes but due to numerical instability it will eventually skew. I should look up my lecture notes, havent revisited this after I stopped teaching. Aug 31, 2016 at 5:40
• Will it skew for any type of transformation, or only ones that are too large? Aug 31, 2016 at 14:42
• A transformation matrix only captures the end result of a transformation, not "how it got there". The matrix for 180° rotation in one direction, the matrix for 180° rotation in the other and the matrix for flipping the grid, that is scaling by (-1, -1), all look the same. Sep 1, 2016 at 21:08
• The first thought that comes to my mind is you could factor the matrix into a Möbius transformation and then lerp the quantities. en.wikipedia.org/wiki/… Sep 6, 2016 at 9:22
• I hadn't heard of the Möbius transformation before, thank you! Sep 6, 2016 at 14:19

As a general rule, you cannot interpolate transformation matrices. In stead, you decompose them into their individual values, then interpolate those and recompose.

The Möbius transformation as suggested in the comments sounds interesting, but tradionally I'd just extract scale and rotation and interpolate those.

Assuming a transformation matrix

    | a  b |
T = | c  d |

• the scale is [sqrt(a² + c²), sqrt(b² + d²)]
• The rotation angle is atan(c/a)

You'd now interpolate this scale and rotation angle, recomposing the matrix at each frame.

 Corrected the angle (as spotted by Nathan Reed) [/Edit]

• Shouldn't the angle be atan(c/a)? (Or better atan2(c, a), if your language supports that.) Also it's worth noting this assumes the matrix doesn't include shear. If it does, you could try extracting that part and interpolating it separately as well. Sep 9, 2016 at 17:45
• In a pure rotation matrix, c = sin(t), and both a and d equal cos(t). So maybe both your answers work? Sep 10, 2016 at 15:53
• Thanks @NathanReed, for correcting the angle! And indeed, this does not take shear into account. I'm used to working in 3D were we can usually get away with ignoring shear, but in 2D transforms I guess shear is used much more frequently. Sep 10, 2016 at 18:16
• @Vermillion: indeed, for a pure rotation matrix they are the same, but for a scaled matrix the scale is different per column (so if you want to use element d in stead, you need to calculate scale first and do something like atan((sx / sy) * c / d). Sep 10, 2016 at 18:16