# Creating a grid of dice representing an image

**URL:** <https://discourse.processing.org/t/creating-a-grid-of-dice-representing-an-image/38364>\
**Category:** Coding Questions\
**Created:** [August 15, 2022, 4:41pm UTC](https://discourse.processing.org/t/creating-a-grid-of-dice-representing-an-image/38364 "2022-08-15T16:41:22Z")\
**Posts on this page:** 1\
**Showing post:** 79

<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:** [November 1, 2022, 6:12pm UTC](https://discourse.processing.org/t/creating-a-grid-of-dice-representing-an-image/38364/79 "2022-11-01T18:12:04Z")

</div>

Hello,

> [@glv](#):
>
> Resize image. This makes it easy to extract a pixel and simplifies things… no need to get an average color of a section. Explore a more advanced approach later…

Try your most recent version of code with:

`img.resize(80, 80);`  
and  
`tilesX = 80;`

Take a close look at this and simplify it:

```auto
      int px = int(x);
      int py = int(y);
      color c = img.get(px,py);

```

Above works as is but can be simplified to one line.

Comment out all the show related code and try this with a suitable fill():

`rect(x*tileW, y*tileH, tileW, tileH);`

You really must go through every line of code and scrutinize it until you understand it.

Add a comment to each important line on your code to explain what it is doing.

Use `println()` where necessary to see the program variables. You can comment them out later!

And voila!

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

Once you have the above working _ **and** _ you understand it try replacing the rectangle with:

- text; this can be 1 to 6 for a die for example.
- other shapes that are the correct size.
- scaling shapes such as a larger die as necessary to the correct size.

Code that I provide is not always intended to be _plug and play_ and _inserted_ in to your code… it is for insight to help you along.

Write and understand simple examples first and then consider how best to integrate them in to your code or not use them.

Try to write code to scale the die first and then integrate it into your code.

Keep at it!

`:)`

---

_[View the full topic](https://discourse.processing.org/t/creating-a-grid-of-dice-representing-an-image/38364)._