Introduction to p5.js and animation

Notes Home

HTML5 Canvas

The HTML5 Canvas is a relatively new HTML element introduced with the HTML5 standard around 2011 to implement graphical programming within the web browser.

The canvas can be used to draw graphics on the screen using JavaScript. This can be done in pure JavaScript but there are many libraries that make drawing to the canvas easier.

One such library is p5 which we will use in this class to learn some programming basics.

Today we're going to get started by adding the p5 library to our web page and playing with some of the functionality and go over some basics with the p5 overview.

https://en.wikipedia.org/wiki/Cartesian_coordinate_system

https://processing.org/reference/environment/