Introduction Features
Definitions Principles The AI model
Teaching Register a class
Getting started P5 tutorial Three.js tutorial
Coding course Coding course II Coding for kids WebGL course AI exercises Python course
Starter Worlds
Editor's Choice Showcase Worlds Multi-user Worlds Random Worlds
Advanced search
Docs API docs
Register Forgot password
  
Drag the background!

Step 7. Variables in p5.js (mouseX, mouseY)

Daniel Shiffman introduces the fundamental concept of a "variable" in programming. P5 has many variables, including ones that track the mouse position. This leads to our first really cool World, where moving the mouse draws a circle at that position. Click the image to run the World. Click "Clone and Edit" and customise it. Go crazy adding objects. You cannot cause any damage!

Video


From: Tutorial 2.1: Variables in p5.js (mouseX, mouseY)

World

Tutorial 2.1
Variables in p5.js (mouseX, mouseY)
The background is a program, showing the JavaScript graphics used on this site.
The globes light up when you log in.
 
Font:

Users retain ownership of user content.

Platforms      Stats      The name      Terms and conditions

Call for partners      Contact

Call for partners!
Ancient Brain is looking for a partner to co-write a JavaScript or Python coding book for schools, to be used worldwide. This would be a course for students in learning to code from scratch. The book and course will be integrated into the Ancient Brain site. This is an opportunity for someone looking to develop a course and textbook to partner with a site to promote it. Read more.