O'Reilly logo

Learn JavaScript with p5.js: Coding for Visual Learners by Engin Arslan

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

© Engin Arslan 2018
Engin ArslanLearn JavaScript with p5.jshttps://doi.org/10.1007/978-1-4842-3426-6_4

4. Operators and Variables

Engin Arslan
(1)
Toronto, Ontario, Canada
 
In Chapters 1 and 2 we learned about variables and math operations that we can use in JavaScript. In this chapter, we will put that knowledge to use.

Setup

Let’s first create a couple of shapes to have something to work with. Using the ellipse and rect functions, let’s create a shape that roughly resembles a cart (Listing 4-1 and Figure 4-1).
function setup() {
        createCanvas(800, 300);
}
function draw() {
        background(220);
        ellipse(100, 200, 50, 50); // left wheel
        ellipse(200, 200, 50, 50); // right wheel
        rect(50, 160, 200, 20) // cart
}
Listing 4-1

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required