Perhaps I do not know fill/random works after all

p5.js Coding Questions
1

Creating a very rough sketch of a generative rothko – three or two rectangles of random size within a range on a muted background – and I’ve come to the conclusion I don’t understand how fill() and/or random() works.

However, what happens is that all the rectangles are the same randomized color. Was I mistaken in thinking that writing fill() next to each rect() would have generated a different color? Can anyone point me in the direction of how to get each of these rectangles to be differently colored or maybe another resource on how fill actually works?

Thank you!

let rectX = 30;
let width = 430;

let r;
let g;
let b;


function setup() {


  r = random(255);
  g = random(255);
  b = random(255);

  createCanvas(500, 500);
  background(0);

  fill(r, g, b);
  rect(rectX, 20, width, random(80, 100));
  
  fill(r, g, b);
  rect(rectX, 200, width, random(25, 250));
  
  fill(r, g, b);
  rect(rectX, 400, width, random(55, 80));
  
}
2

You need to repeat this every time

2 Likes
3

Thanks! Is there a reason for this in terms of how p5js reads this? I would have assumed that the variables would have been randomized since they were created globally.

Also is there an obvious way I’m missing to make my code dry-er? There is a lot of repetition as of now.

4

r and g and b only change the color when you tell them to. That’s what the 3 lines do. But they don’t change the color throughout but only when you tell them to.

Hence you need to repeat the lines every time you want them to have new values

1 Like