FAQ: Animation with p5.js - Random

This community-built FAQ covers the “Random” exercise from the lesson “Animation with p5.js”.

Paths and Courses
This exercise can be found in the following Codecademy content:

Learn p5.js

FAQs on the exercise Random

There are currently no frequently asked questions associated with this exercise – that’s where you come in! You can contribute to this section by offering your own questions, answers, or clarifications on this exercise. Ask or answer a question by clicking reply (reply) below.

If you’ve had an “aha” moment about the concepts, formatting, syntax, or anything else with this exercise, consider sharing those insights! Teaching others and answering their questions is one of the best ways to learn and stay sharp.

Join the Discussion. Help a fellow learner on their journey.

Ask or answer a question about this exercise by clicking reply (reply) below!
You can also find further discussion and get answers to your questions over in Language Help.

Agree with a comment or answer? Like (like) to up-vote the contribution!

Need broader help or resources? Head to Language Help and Tips and Resources. If you are wanting feedback or inspiration for a project, check out Projects.

Looking for motivation to keep learning? Join our wider discussions in Community

Learn more about how to use this guide.

Found a bug? Report it online, or post in Bug Reporting

Have a question about your account or billing? Reach out to our customer support team!

None of the above? Find out where to ask other questions here!

Hi i have question about last example from animation class.

Why we use as a star ellipse and no circle as I can see there are only circles rendered.

Second question is why i am seeing echoes after moving objects? Its nice effect, but nowhere set.

Thanks

Hello, let me answer your 2nd question.

You may wish to look into background(p1, p2) in the function draw().

p1 specifies a value between white and black whereas p2 specifies opacity of the background relative to current colour range (default is 0-255). The smaller the p2 value, the clearer the trail behind.

The reason for this is, when the draw() function is called on every frame, the new frame with a new background colour will be placed on the old frame. If the background consists an alpha value, a semi-transparent frame will be placed on top of the previous frame. That’s why we can see the previous positions of the object.

You may try to change the value of p2 and see how the echoes change.

Hope it helps. :melting_face:

Hi, I’m enjoying this course so far.

And I’m wondering, why are these circles remaining?
I mean, in previous lessons, the shapes are re-rendered in each draw looping. However, in this random lesson circles rendered are remaining and new circle are generated on old ones.

Why does this happen? If anybody know, please teach me. Thank you.

Sorry, I found the reason.
It’s natural that old circles remain . Because as [csswhiz46367] said above, new frame is rendered on old one.
So to draw animation on the canvas, previous lessons call background(0); in each draw() loop so that the canvas looks fresh.

I was silly but I keep this post for someone’s information.

1 Like