# A grid of grids with variable number of cells

**URL:** <https://discourse.processing.org/t/a-grid-of-grids-with-variable-number-of-cells/40418>\
**Category:** Coding Questions\
**Created:** [January 2, 2023, 10:18pm UTC](https://discourse.processing.org/t/a-grid-of-grids-with-variable-number-of-cells/40418 "2023-01-02T22:18:53Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![debxyz](https://avatars.discourse-cdn.com/v4/letter/d/58956e/32.png) [@debxyz](https://discourse.processing.org/u/debxyz)\
**Post date:** [January 2, 2023, 10:18pm UTC](https://discourse.processing.org/t/a-grid-of-grids-with-variable-number-of-cells/40418/1 "2023-01-02T22:18:53Z")

</div>

Hello! 🙂

I’m trying to figure out where I can initialize a new random number of cells for each grid object. For example, the first grid might be divided 2 times, the second grid divided 7 times, etc…

The attached code runs, but all 4 grids have the same number of cell divisions… 🤔

Any guidance is most welcome!  
🤓

```auto
Grid [] grid = new Grid[4]; //number of grids inside the overall grid

int div = int(random(2, 9)); //division of cells in each grid object

void setup() {
  size(600, 600);
  //noLoop();
  frameRate(2);

  int k = 0;
  int counter = width/2; // equals "2"

  for (int x = 0; x<width; x+=counter) {
    for (int y = 0; y<height; y+=counter) {
      pushMatrix();
      translate(0, 0);
      grid[k] = new Grid(div, x, y);
      popMatrix();

      k++;
    }
  }
}

void draw() {

  strokeWeight(1);
  
  //div = int(random(2, 9)); //division of cells in each grid object

  for (Grid g : grid) {
    g.display();
  }

  //grid of grids guide
  pushStyle();
  strokeWeight(2);
  stroke(0, 255, 0);
  line(width/2, 0, width/2, height);
  line(0, height/2, width, height/2);
  popStyle();
}

```

///////////////////////////////////////////////////////////

```auto
class Grid {

  float divisions;
  float sz;
  float x;
  float y;

  Grid(float divisions_, float x_, float y_) {

    divisions = divisions_;
    sz = width/2/divisions;
    x = x_;
    y = y_;
  }

  void display() {

    for (float i = 0; i<divisions; i++) {
      for (float j = 0; j<divisions; j++) {

        fill(random(150, 255), random(10), random(10));
        rect(x+i*sz, y+j*sz, sz, sz); //top left

        
      }
    }
    println(divisions);
  }
}

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [January 2, 2023, 10:30pm UTC](https://discourse.processing.org/t/a-grid-of-grids-with-variable-number-of-cells/40418/2 "2023-01-02T22:30:22Z")

</div>

in setup()?

```auto
Grid [] grid = new Grid[4]; //number of grids inside the overall grid

int div = int(random(2, 9)); //division of cells in each grid object

void setup() {
  size(600, 600);
  //noLoop();
  frameRate(2);

  int k = 0;
  int counter = width/2; // equals "2"

  for (int x = 0; x<width; x+=counter) {
    for (int y = 0; y<height; y+=counter) {
      pushMatrix();
      translate(0, 0);
      div = int(random(2, 9)); //division of cells in each grid object
      grid[k] = new Grid(div, x, y);
      popMatrix();

      k++;
    }
  }
}

void draw() {

  strokeWeight(1);

  //div = int(random(2, 9)); //division of cells in each grid object

  for (Grid g : grid) {
    g.display();
  }

  ////grid of grids guide
  //pushStyle();
  //strokeWeight(2);
  //stroke(0, 255, 0);
  //line(width/2, 0, width/2, height);
  //line(0, height/2, width, height/2);
  //popStyle();
}

/////////////////////////

class Grid {

  float divisions;
  float sz;
  float x;
  float y;

  Grid(float divisions_, float x_, float y_) {

    divisions = divisions_;
    sz = width/2/divisions;
    x = x_;
    y = y_;
  }

  void display() {

    for (float i = 0; i<divisions; i++) {
      for (float j = 0; j<divisions; j++) {

        fill(random(150, 255), random(10), random(10));
        rect(x+i*sz, y+j*sz, sz, sz); //top left
      }
    }
    println(divisions);
  }
}

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [January 2, 2023, 11:03pm UTC](https://discourse.processing.org/t/a-grid-of-grids-with-variable-number-of-cells/40418/3 "2023-01-02T23:03:04Z")

</div>

```auto

Grid [] grid = new Grid[16]; // number of grids inside the overall grid

int div; //division of cells in each grid object

void setup() {
  size(600, 600);
  frameRate(2);
  strokeWeight(1);

  int k = 0;
  int counter = width/4; // equals "2"

  for (int x = 0; x<width; x+=counter) {
    for (int y = 0; y<height; y+=counter) {
      div = int(random(2, 9)); //division of cells in each grid object
      grid[k] = new Grid(div, x, y);

      k++;
    }
  }
}

void draw() {
  background(0); 

  for (Grid g : grid) {
    if (g!=null)
      g.display();
  }

  ////grid of grids guide
  //pushStyle();
  //strokeWeight(2);
  //stroke(0, 255, 0);
  //line(width/2, 0, width/2, height);
  //line(0, height/2, width, height/2);
  //popStyle();
}

/////////////////////////

class Grid {

  float divisions;
  float sz;
  float x;
  float y;

  int col1=int(random(256)); 
  int col2=int(random(256)); 

  // constr 
  Grid(float divisions_, 
    float x_, float y_) {

    divisions = divisions_;
    sz = width/4/divisions;
    x = x_;
    y = y_;
  }// constr 

  void display() {

    for (float i = 0; i<divisions; i++) {
      for (float j = 0; j<divisions; j++) {

        fill(random(150, 255), col1, col2);
        // stroke(random(150, 255), col1, col2);
        // noFill(); 
        rect(x+i*sz, y+j*sz, 
          sz, sz);
      }
    }
    println(divisions);
  }
}//class

```

---

<div class="post-metadata">

**Author:** ![debxyz](https://avatars.discourse-cdn.com/v4/letter/d/58956e/32.png) [@debxyz](https://discourse.processing.org/u/debxyz)\
**Post date:** [January 3, 2023, 1:39am UTC](https://discourse.processing.org/t/a-grid-of-grids-with-variable-number-of-cells/40418/4 "2023-01-03T01:39:53Z")

</div>

Thank you @Chrisir !! 🙂  
Very much appreciated!!

> [@Chrisir](#):
>
> ```auto
> div = int(random(2, 9)); //division of cells in each grid object
> 
> ```

Oh yeah that works! At one point I had tried it in setup() BUT had placed it **above** the for loops…

And then regarding:

> [@Chrisir](#):
>
> ```auto
> for (Grid g : grid) { //for each object g in the grid array 
> if (g!=null) // if g is not equal to "0"
> g.display(); //draw the grid object(s)
> 
> ```

I’m curious about the purpose of line:

`if(g! = null)`

When would (or could) null happen? Is it some kind of built-in safety valve? Though for what reason I’m not sure. I did some googling, but… 🤔

🤓

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [January 3, 2023, 2:58am UTC](https://discourse.processing.org/t/a-grid-of-grids-with-variable-number-of-cells/40418/5 "2023-01-03T02:58:05Z")

</div>

> [@debxyz](#):
>
> When would (or could) null happen?

I had null once when I set the upper bounds of the for loops in setup() to 1. (then only one quarter was drawn but the array still had full length.)
