Processing Generative World

Question

I'm trying to create a generative world with four randomly generated (location, size, colour) objects, each mouseClicked is supposed to regenerate those four objects in a random location, size, colour, etc. I have a method to draw the objects, now I'm trying to figure out how to actually draw the limited number of objects that I want because now the code will just constantly generate more and more objects.

final int NUM_OBJECTS = 4;     
int numObjectsLeft;
float x;
float y;
float radius;

void renderBackground() {
  //sky
  fill(135, 206, 235);
  rect(0, 0, width, height);
  //grass
  fill(86, 125, 70);
  rect(0, 500, 1400, 750);
  //Pathway
  fill(181, 101, 29);
  rect(0, 600, 1400, 100);
  //Buildings
  fill(128, 128, 128);
  rect(900, 300, 100, 200);
  rect(1000, 350, 80, 150);
  fill(160, 220, 222);
  rect(915, 315, 30, 30);
  rect(955, 315, 30, 30);
  rect(915, 355, 30, 30);
  rect(955, 355, 30, 30);
  rect(915, 395, 30, 30);
  rect(955, 395, 30, 30);
  rect(915, 435, 30, 30);
  rect(955, 435, 30, 30);
  rect(1010, 360, 25, 25);
  rect(1045, 360, 25, 25);
  rect(1010, 395, 25, 25);
  rect(1045, 395, 25, 25);
  rect(1010, 430, 25, 25);
  rect(1045, 430, 25, 25);
  //Trees
  fill(102, 51, 0);
  rect(275, 430, 50, 100);
  fill(97, 138, 61);
  ellipse(300, 400, 100, 100);
  fill(102, 51, 0);
  rect(380, 450, 40, 75);
  fill(97, 138, 61);
  ellipse(400, 425, 80, 80);
  //Hills
  fill(122, 115, 114);
  triangle(100, 500, 200, 500, 150, 300);
  triangle(175, 500, 225, 500, 200, 400);
}

void renderObject(float x, float y, float radius, int numObjectsLeft) {

  fill(255);
  line(x, y+(radius/2), x, y+radius+30);
  line(x, y+radius-5, x+(radius/2), y+radius+25);
  line(x, y+radius-5, x-(radius/2), y+radius+25);
  line(x, y+radius+30, x+(radius/2), y+radius*2+25);
  line(x, y+radius+30, x-(radius/2), y+radius*2+25);
  ellipse(x, y, radius, radius);
   
}

void renderForeground() {
  numObjectsLeft = NUM_OBJECTS;
  x = random(0, 1400);
  y = random(500, 700);
  radius = 30;
  numObjectsLeft--;
  
  renderObject(x,y,radius,numObjectsLeft--);
  
  if (numObjectsLeft > 0) {
  
    renderObject(x,y,radius,numObjectsLeft);
  
    if(numObjectsLeft <= 0) { 
      exit();
          
    }
  
}
  
}

void setup() {

  size(1400, 750);
  renderBackground();
  numObjectsLeft = NUM_OBJECTS;
}

void draw() {

  x = random(0, 1400);
  y = random(500, 700);
  radius = 30;

  renderForeground();

}

void mousePressed() {
}

Answer 1

You're very close to achieving your goal.

Currently you're not clearing the background, so new objects are "appended"/rendered on top of was previously drawn.

An easy option is to simple call renderBackground() before rendering the foreground object.

e.g. draw() becomes:

void draw() {
  renderBackground();

  x = random(0, 1400);
  y = random(500, 700);
  radius = 30;

  renderForeground();

}

If you want render on click you could move the instructions from draw() into mousePressed(). Additionally if you want to render the objects 4 times you can call the function that renders an object 4 times using a for loop:

void draw() {
  

}

void mousePressed() {
  renderBackground();
  
  for(int i = 0 ; i < 4; i++){
    x = random(0, 1400);
    y = random(500, 700);
    radius = 30;
  
    renderForeground();
  }
}

Off topic from the goals described, I can see your attempt and would like to point you to a few unclarities or things that could be improved:

• in void renderObject(float x, float y, float radius, int numObjectsLeft) numObjectsLeft isn't used
• it's unclear why you're using if and duplicated code (radius = 30, randomised x, y), perhaps the intention was to use frames to add an object per frame ? (4 object with 1 object per frame at 60fps is still pretty fast and the effect of 4 objects gradually appearing might not be perceived well enough)
• it's unclear why you need to exit(), perhaps the intention was to stop rendering a new object after the last (4th) one was drawn ? (if the previous point about adding an object per frame, up to 4 objects, you could stop the draw() loop using noLoop()

If you want to draw 4 randomised objects in one frame your code could be simplified to:

final int NUM_OBJECTS = 4;     
float x;
float y;
float radius = 30;

void renderBackground() {
  //sky
  fill(135, 206, 235);
  rect(0, 0, width, height);
  //grass
  fill(86, 125, 70);
  rect(0, 500, 1400, 750);
  //Pathway
  fill(181, 101, 29);
  rect(0, 600, 1400, 100);
  //Buildings
  fill(128, 128, 128);
  rect(900, 300, 100, 200);
  rect(1000, 350, 80, 150);
  fill(160, 220, 222);
  rect(915, 315, 30, 30);
  rect(955, 315, 30, 30);
  rect(915, 355, 30, 30);
  rect(955, 355, 30, 30);
  rect(915, 395, 30, 30);
  rect(955, 395, 30, 30);
  rect(915, 435, 30, 30);
  rect(955, 435, 30, 30);
  rect(1010, 360, 25, 25);
  rect(1045, 360, 25, 25);
  rect(1010, 395, 25, 25);
  rect(1045, 395, 25, 25);
  rect(1010, 430, 25, 25);
  rect(1045, 430, 25, 25);
  //Trees
  fill(102, 51, 0);
  rect(275, 430, 50, 100);
  fill(97, 138, 61);
  ellipse(300, 400, 100, 100);
  fill(102, 51, 0);
  rect(380, 450, 40, 75);
  fill(97, 138, 61);
  ellipse(400, 425, 80, 80);
  //Hills
  fill(122, 115, 114);
  triangle(100, 500, 200, 500, 150, 300);
  triangle(175, 500, 225, 500, 200, 400);
}

void renderObject(float x, float y, float radius) {

  fill(255);
  line(x, y+(radius/2), x, y+radius+30);
  line(x, y+radius-5, x+(radius/2), y+radius+25);
  line(x, y+radius-5, x-(radius/2), y+radius+25);
  line(x, y+radius+30, x+(radius/2), y+radius*2+25);
  line(x, y+radius+30, x-(radius/2), y+radius*2+25);
  ellipse(x, y, radius, radius);
   
}

void setup() {

  size(1400, 750);
  renderBackground();
}

void draw() {

}

void mousePressed() {
  
  renderBackground();
  
  for(int i = 0; i < NUM_OBJECTS; i++){
    x = random(0, 1400);
    y = random(500, 700);
    renderObject(x,y,radius);
  }
}

It's a good idea to re-read your own code and remove anything uncessary (and try to avoid code duplication. This will have a few benefits:

• you will only have code you fully understand (and haven't already forgotten about)
• it will be less code to read/fix/debug
• the more readable the code the better. By less I don't mean making removing spacing, making code compact: code readability is important. On the long run the programs you write will eventually get longer and you'll spend more time read code than writing code. The easier you make it for yourself (and future team members) to quickly scan and understand the code (infer how it would run), the better.