We’ve learned a lot about what happens in the background when a p5.js sketch starts! The
setup() function is automatically called, creating an HTML
<canvas> element in our index.html. Now, let’s learn how to use the p5.js library to draw two-dimensional shapes!
The p5.js sketch, or HTML
In this this lesson, we will introduce the following shape functions:
We will also introduce how to change the style of shapes using:
Let’s start by learning about the coordinate system that p5.js canvas uses!
On the right is a p5.js sketch of a repeating pattern made up of simple lines and shapes. By the end of this lesson, you will learn how to create your own patterns of shapes!
Click “Next” to learn about the coordinate system that p5.js canvas uses.