We want to rotate around the centre of our sprite, but the HTML Canvas always rotates around its zero-point.

The answer is to move the zero point. In geometry, moving everything by the same amount in the same direction is called translation.

The canvas method we use is called translate.

It moves the zero point to where we want, then we can rotate around that point.