Learn creative coding writing simple programs

28. Rotate and even move your axes

There are two things we have assumed to be true since the first episodes: when we increase the X coordinate things get drawn more to the right, and the pixel 0,0 is at the top left corner of the display.
We now discover that the X axis does not always point to the right: if we call rotate() the X axis can point anywhere, like the needles of a clock. We could turn our graphics up side down using rotate().
We also discover that we can move the axes. If we do, the 0, 0 point is no longer at the top left corner of the screen.
We show that adding just one line in our program to the beginning of our draw() function we can create drawings that rotate around the center of the screen, instead of rotating around the top left corner.

Tags: rotate, translate

Code editor

You can make changes to the code below. Then

Questions and comments

Try to stay close to the topic of this episode. Use the Processing forums for help with unrelated Processing projects (or hire me for help ;-)

To indicate that a word in your comment is code, use the `backtick`. Example
Do `float` and `int` smell similar?
 To highlight code blocks, surround it with ``` code-fences ``` like this:
``` void setup() { size(600, 600); } ```