# Draw a PShape from a PShape array

**URL:** <https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473>\
**Category:** Beginners\
**Tags:** homework\
**Created:** [July 22, 2023, 1:27pm UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473 "2023-07-22T13:27:57Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![eliamedeot](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/eliamedeot/32/18593_2.png) [@eliamedeot](https://discourse.processing.org/u/eliamedeot)\
**Post date:** [July 22, 2023, 1:27pm UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473/1 "2023-07-22T13:27:57Z")

</div>

Hello, I’m getting a “NullPointerException” trying to draw a PShape from an array of the same type.  
This is the code snippet:

```auto
PShape s10, s15, s20, s25, s30, s35, s40, s45, s50;

PShape[][] grid = {
  {s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50},
  {s50, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s50},
  {s50, s45, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s45, s50},
  {s50, s45, s40, s35, s35, s35, s35, s35, s35, s35, s35, s35, s35, s35, s35, s40, s45, s50},
  {s50, s45, s40, s35, s30, s30, s30, s30, s30, s30, s30, s30, s30, s30, s30, s40, s45, s50},
  {s50, s45, s40, s35, s30, s25, s25, s25, s25, s25, s25, s25, s25, s30, s30, s40, s45, s50},
  {s50, s45, s40, s35, s30, s25, s20, s20, s20, s20, s20, s20, s25, s30, s30, s40, s45, s50},
  {s50, s45, s40, s35, s30, s25, s20, s15, s15, s15, s15, s20, s25, s30, s35, s40, s45, s50},
  {s50, s45, s40, s35, s30, s25, s20, s15, s10, s10, s15, s20, s25, s30, s35, s40, s45, s50},
  {s50, s45, s40, s35, s30, s25, s20, s15, s10, s10, s15, s20, s25, s30, s35, s40, s45, s50},
  {s50, s45, s40, s35, s30, s25, s20, s15, s15, s15, s15, s20, s25, s30, s35, s40, s45, s50},
  {s50, s45, s40, s35, s30, s25, s20, s20, s20, s20, s20, s20, s25, s30, s35, s40, s45, s50},
  {s50, s45, s40, s35, s30, s25, s25, s25, s25, s25, s25, s25, s25, s30, s35, s40, s45, s50},
  {s50, s45, s40, s35, s30, s30, s30, s30, s30, s30, s30, s30, s30, s30, s35, s40, s45, s50},
  {s50, s45, s35, s35, s35, s35, s35, s35, s35, s35, s35, s35, s35, s35, s35, s40, s45, s50},
  {s50, s45, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s40, s45, s50},
  {s50, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s45, s50},
  {s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50},
};

setup() {
  s10 = createSegment(torusRadius, radius, radians(10), cylinderHeight, sides);
  s15 = createSegment(torusRadius, radius, radians(15), cylinderHeight, sides);
  s20 = createSegment(torusRadius, radius, radians(20), cylinderHeight, sides);
  s25 = createSegment(torusRadius, radius, radians(25), cylinderHeight, sides);
  s30 = createSegment(torusRadius, radius, radians(30), cylinderHeight, sides);
  s35 = createSegment(torusRadius, radius, radians(35), cylinderHeight, sides);
  s40 = createSegment(torusRadius, radius, radians(40), cylinderHeight, sides);
  s45 = createSegment(torusRadius, radius, radians(45), cylinderHeight, sides);
  s50 = createSegment(torusRadius, radius, radians(50), cylinderHeight, sides);
} //setup

void draw() {
  for (int x = 0; x < tilesX; x++) {
    for (int y = 0; y < tilesX; y++) {
      pushMatrix();
      translate(tilesW * x, tilesH * y);
      rotateX(HALF_PI);
      rotateY(rotation[x][y]);

      // NullPointerException
      shape(grid[x][y]);

      popMatrix();
    } //for x
  } //for y
} //draw

```

For a visual reference, this is what I’m trying to recreate in Processing:

 ![Il-Gruppo-N-e-larte-contemporanea-una-storia-tutta-padovana-1](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/f/f/ff6f7f765b62e99abad7178409a31f5bcc4e1824.jpeg)

I’ve been able to create all the segments as PShapes, but I’m having trouble drawing them, since the ones on the outside have a different inclination from the ones on the inside, hence the matrix that defines which one to draw.

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [July 22, 2023, 2:01pm UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473/2 "2023-07-22T14:01:46Z")

</div>

Hello @eliamedeot,

> [@eliamedeot](#):
>
> I’m getting a “NullPointerException” trying to draw a PShape

I the future please provide more details about the error.

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/7/d/7dfc27801dd01d11712f4049fe512931d67cf436.png)

Take a look at the resources (tutorials, references, examples, etc.) here:

> **[Welcome to Processing!](https://processing.org/)**
>
> Processing is a flexible software sketchbook and a language for learning how to code. Since 2001, Processing has promoted software literacy within the visual arts and visual literacy within technology…

For example:

> **[size() / Reference](https://processing.org/reference/size_.html)**
>
> Defines the dimension of the display window width and height in units of pixels. In a program that has the setup() function, the size() function must be the first line of code inside …

There are more errors…

`:)`

---

<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:** [July 22, 2023, 2:02pm UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473/3 "2023-07-22T14:02:31Z")

</div>

Apparently, you need to create the shapes before you can fill the grid

it works with String though

(your code isn’t runable, so I had to add a lot)

example:

```auto

PShape s10, s15, s20, s25, s30, s35, s40, s45, s50;

String[][] grid = {
  {
    "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50"
  }
  ,
  {
    "s50", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s30", "s30", "s30", "s30", "s30", "s30", "s30", "s30", "s30", "s30", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s25", "s25", "s25", "s25", "s25", "s25", "s25", "s25", "s30", "s30", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s25", "s20", "s20", "s20", "s20", "s20", "s20", "s25", "s30", "s30", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s25", "s20", "s15", "s15", "s15", "s15", "s20", "s25", "s30", "s35", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s25", "s20", "s15", "s10", "s10", "s15", "s20", "s25", "s30", "s35", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s25", "s20", "s15", "s10", "s10", "s15", "s20", "s25", "s30", "s35", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s25", "s20", "s15", "s15", "s15", "s15", "s20", "s25", "s30", "s35", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s25", "s20", "s20", "s20", "s20", "s20", "s20", "s25", "s30", "s35", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s25", "s25", "s25", "s25", "s25", "s25", "s25", "s25", "s30", "s35", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s35", "s30", "s30", "s30", "s30", "s30", "s30", "s30", "s30", "s30", "s30", "s35", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s35", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s40", "s45", "s50"
  }
  ,
  {
    "s50", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s45", "s50"
  }
  ,
  {
    "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50", "s50"
  }
  ,
};

float torusRadius=12;
float radius = 21;
float cylinderHeight=12, sides=12;

void setup() {
  size(880, 880, P3D);

  s10 = createShape(RECT, 0, 0, 50, 50);// createSegment(torusRadius, radius, radians(10), cylinderHeight, sides);
  s15 = createShape(RECT, 0, 0, 50, 50);//createSegment(torusRadius, radius, radians(15), cylinderHeight, sides);
  s20 =createShape(RECT, 0, 0, 50, 50);// createSegment(torusRadius, radius, radians(20), cylinderHeight, sides);
  s25 =createShape(RECT, 0, 0, 50, 50);// createSegment(torusRadius, radius, radians(25), cylinderHeight, sides);
  s30 =createShape(RECT, 0, 0, 50, 50);// createSegment(torusRadius, radius, radians(30), cylinderHeight, sides);
  s35 =createShape(RECT, 0, 0, 50, 50);// createSegment(torusRadius, radius, radians(35), cylinderHeight, sides);
  s40 =createShape(RECT, 0, 0, 50, 50);// createSegment(torusRadius, radius, radians(40), cylinderHeight, sides);
  s45 = createShape(RECT, 0, 0, 50, 50);//createSegment(torusRadius, radius, radians(45), cylinderHeight, sides);
  s50 =createShape(RECT, 0, 0, 50, 50);// createSegment(torusRadius, radius, radians(50), cylinderHeight, sides);
} //setup

void draw() {
  for (int x = 0; x < grid.length; x++) {
    for (int y = 0; y < grid[0].length; y++) {
      pushMatrix();
      translate(12 * x, 12 * y);
      rotateX(HALF_PI);
      rotateY(.22);

      // NullPointerException
      println (grid[x][y]);
      switch (grid[x][y]) {
      case "s10":
        shape(s10);
        break;
      case "s15":
        shape(s15);
        break;
      case "s45":
        shape(s45);
        break;
      }

      popMatrix();
    } //for x
  } //for y
} //draw

```

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [July 22, 2023, 2:15pm UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473/4 "2023-07-22T14:15:17Z")

</div>

Hello @eliamedeot ,

Please read:

> [@Guidelines—Asking Questions](https://discourse.processing.org/t/guidelines-asking-questions/2147):
>
> Summary (TL;DR) Ask complete questions to get better answers! Be specific. For example: I want to load an image. I tried using createImg() , and I expected the image to be on canvas, but what happened instead was the image showing up below the canvas. Isolate your problem and work in small steps. Share only the code directly related to your problem if it is part of a bigger project, and if something isn’t working, try the smallest code that could do the thing you want. Can we run your code to …

There is a reference to this in the Guidelines:

> **[How to create a Minimal, Reproducible Example - Help Center](https://stackoverflow.com/help/minimal-reproducible-example)**
>
> Stack Overflow | The World’s Largest Online Community for Developers

By generating an MCVE you may be able to solve the problem before asking for help.

If you do post an MCVE we may be able to better guide you to a solution.

The Homework Policy is in the FAQ if you are not already aware:  
[https://discourse.processing.org/faq](https://discourse.processing.org/faq)

`:)`

---

<div class="post-metadata">

**Author:** ![eliamedeot](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/eliamedeot/32/18593_2.png) [@eliamedeot](https://discourse.processing.org/u/eliamedeot)\
**Post date:** [July 22, 2023, 2:24pm UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473/5 "2023-07-22T14:24:37Z")

</div>

Sorry @glv, I didn’t post the full code because it’s 250 lines long.  
As @Chrisir noted, I started filling the grid before creating the shapes. By moving the whole part in the setup() now everything is working. Thanks @Chrisir!

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [July 22, 2023, 2:35pm UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473/6 "2023-07-22T14:35:09Z")

</div>

> [@eliamedeot](#):
>
> Sorry @glv, I didn’t post the full code because it’s 250 lines long.

An apology to me is not necessary.

When you focus on process you become resourceful and a better coder in the long run.

The Guidelines have some good advice in there.

Enjoy the adventure!

`:)`

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [July 22, 2023, 3:56pm UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473/7 "2023-07-22T15:56:24Z")

</div>

> [@eliamedeot](#):
>
> ```auto
> PShape s10, s15, s20, s25, s30, s35, s40, s45, s50;
> 
> PShape[][] grid = {
> {s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50, s50},
> 
> ```

Just leaving an observation:

In Java, and many other languages, when we access a variable, its content is read immediately.

B/c all those s## variables are still `null` when you create the 2d-array, that’s the value you’re filling the array with.

It doesn’t matter if you assign PShape values to those s## variables later, it won’t magically change the `null` previously stored in the array.

In short, Java arrays can’t store actual variables, but the current value stored in variables.

---

<div class="post-metadata">

**Author:** ![MuddyGardener](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/muddygardener/32/1719_2.png) [@MuddyGardener](https://discourse.processing.org/u/MuddyGardener)\
**Post date:** [July 27, 2023, 10:35am UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473/8 "2023-07-27T10:35:33Z")

</div>

In some languages there is a way to cause a string to be treated as a variable name. Lisp (at least some dialects), R, probably others. Is this not possible in Java? (My only contact with Java so far is via Processing, so this isn’t yet obvious to me.)

---

<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:** [July 27, 2023, 12:06pm UTC](https://discourse.processing.org/t/draw-a-pshape-from-a-pshape-array/42473/9 "2023-07-27T12:06:51Z")

</div>

You can use a Hashmap to go from String to PShape