Beginner question/s for a simple project

p5.js Beginners
1

Hi everyone,

I’ve just started learning P5 and have just made an simplistic randomized program.

I’m looking to make it a touch more complex but the 3 things I want to do, I don’t even have the coding vocabulary/thought process to know where to even begin looking on the reference page. If anyone could help with the 3 questions, I’d greatly appreciate it!

  1. I have a square, circle & triangle of a random size and positioning on the canvas, but as the last shape coded in the ‘void draw ()’ section is the triangle, it will always appear over the other two shapes. I want to somehow randomize the 3 shapes layering, as opposed to them always being layered in their coded sequence, is there a way to do this?

  2. The 3 shapes have their own ‘fill’ color, but I actually want to randomly assign each of the colors to any one of the shapes (but only once each time.) Not sure how to do this.

  3. My other issue is how to keep the shapes that are generated within the canvas area, instead of having half a circle in the canvas area and the other half off in no-where’s land?

Thanks in advance to anyone who can answer any/all of these questions, appreciate it! :blush:

1 Like
2

Hello,

Create an array with 3 numbers: 0, 1, 2 < I used numbers to keep it simple for use later
Array > See examples

Shuffle the array: 2, 0, 1 < This will be different with each shuffle
shuffle() See reference

Loop through the elements of the array; 0, 1, 2 contains 2, 0, 1 after shuffling
for See reference
Use the contents of the array element with a switch\case statement that has your shapes.
switch\case does not seem to be in references but does work in p5.js!

You can do similar for color with an array of 3 colors and size of the shapes.

You will need to control how and when you shuffle arrays.
keyPressed() is one option > See reference

Give it a try!

:)

3

Thank for the answer!

Where am I putting shuffle and array? Am I declaring a variable, then initializing and using?

I guess I’m asking where are array() and shuffle() going, in ‘setup’ or in ‘draw’?

Sorry, I know this probably a seriously newbie question, thanks for your help :+1: :point_left:

4

Updated my last post.

Take a look at references for setup() and draw() and the references\examples that I suggested.

We all have to start somewhere.

Start writing some code and take it out for a spin.

:)

5

Thanks a lot glv, I’ll bone-up on it and give it a go.

Much appreciated, thanks :+1:

1 Like