Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Version published after converting to the new editor


p5.js uses a Cartesian coordinate system, where the zero point is in the upper left corner. The X axis is from left to right and the Y axis is from top to bottom. While this might seem odd, it comes from the tradition that bitmaps were always read in that order. In computer graphics the cartesian coordinate system is almost always used.

...

Frequently, local and global coordinate systems will be used. The global coordinate system is the original coordinate system, in p5.js this is the one fixed to the upper left corner. If the original coordinate system is transformed, then the result is local coordinate system (in reference to the global). push() and pop() store information related to the current transformation state and style settings.

With an example program, this should be easier to understand:

...