# How to split image into several ones (spirtes)

**URL:** <https://discourse.processing.org/t/how-to-split-image-into-several-ones-spirtes/27365>\
**Category:** Beginners\
**Created:** [January 25, 2021, 4:04pm UTC](https://discourse.processing.org/t/how-to-split-image-into-several-ones-spirtes/27365 "2021-01-25T16:04:32Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [January 25, 2021, 4:04pm UTC](https://discourse.processing.org/t/how-to-split-image-into-several-ones-spirtes/27365/1 "2021-01-25T16:04:32Z")

</div>

Hi!  
I am trying to make the basics for chess and I am interested how to turn an image into an array of sprites.

> **Code**
>
> ```auto
> PImage source = loadImage("chessPieces2.png");
> println(source.width, source.height);
> size(1200, 400);
> background(0);
> rect(0, height/2, width, height/2);
> noFill();
> stroke(255);
> image(source, 0, 0);
> float m = 1.333, scl = 130*m, xoff = 10*m, yoff = 10*m, xbuffer=20*m, ybuffer=20*m;
> for (int j = 0; j < 2; j++) {
> for (int i = 0; i < 6; i++) {
> rect(xoff+i*scl+(i*xbuffer), yoff+j*scl+(j*ybuffer), scl, scl);
> }
> stroke(0);
> }
> 
> ```

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

I want to split this image (transparent png in the background) into 12 sprites. I know the exact position of every square and the image is names “chessPieces2.png” (here:)

 ![chessPieces2](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/9/9b86cc88c61187fdb904ee875642cac7cf205ec0.png)

How do I do it?

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [January 25, 2021, 6:03pm UTC](https://discourse.processing.org/t/how-to-split-image-into-several-ones-spirtes/27365/2 "2021-01-25T18:03:12Z")

</div>

```auto
img.get(x,y,w,h)

```

is the solution : P