# Drawing shapes in between loadPixels() and updatePixels()

**URL:** <https://discourse.processing.org/t/drawing-shapes-in-between-loadpixels-and-updatepixels/19991>\
**Category:** Coding Questions\
**Created:** [April 21, 2020, 8:09am UTC](https://discourse.processing.org/t/drawing-shapes-in-between-loadpixels-and-updatepixels/19991 "2020-04-21T08:09:18Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Gabe](https://avatars.discourse-cdn.com/v4/letter/g/5daacb/32.png) [@Gabe](https://discourse.processing.org/u/Gabe)\
**Post date:** [April 21, 2020, 8:09am UTC](https://discourse.processing.org/t/drawing-shapes-in-between-loadpixels-and-updatepixels/19991/1 "2020-04-21T08:09:18Z")

</div>

I notice that I can’t draw primitive shapes in between calls to` loadPixels()` and `updatePixels()`. Consider the following sketch:

```auto
void setup() {
  size(200, 100);
}

void draw() {
  fill(0);
  ellipseMode(CENTER);
  ellipse(50, 50, 50, 50);
  
  loadPixels();
  ellipse(150, 50, 50, 50);
  updatePixels();
}

```

When run, the first circle is visible, but the second circle does not appear. If I remove the calls to `loadPixels()` and `updatePixels()`, both circles appear as expected.

Is there a way I can draw shapes in between calls to `loadPixels()` and `updatePixels()`? The project I’m working on requires this and it would be difficult/less performant to implement differently.

Thank you so much! 🙂

---

<div class="post-metadata">

**Author:** ![neilcsmith](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/neilcsmith/32/144_2.png) [@neilcsmith](https://discourse.processing.org/u/neilcsmith)\
**Post date:** [April 21, 2020, 9:19am UTC](https://discourse.processing.org/t/drawing-shapes-in-between-loadpixels-and-updatepixels/19991/2 "2020-04-21T09:19:22Z")

</div>

> [@Gabe](#):
>
> The project I’m working on requires this and it would be difficult/less performant to implement differently.

The project you are working on _does not_ require you to write broken code! 😉

This isn’t supported for a reason. What are you actually trying to achieve?

---

<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:** [April 21, 2020, 11:25am UTC](https://discourse.processing.org/t/drawing-shapes-in-between-loadpixels-and-updatepixels/19991/3 "2020-04-21T11:25:41Z")

</div>

> [@Gabe](#):
>
> Is there a way I can draw shapes in between calls to `loadPixels()` and `updatePixels()` ?

You can draw them but won’t see them.

> **[draw() / Reference](https://processing.org/reference/draw_.html)**
>
> Called directly after setup(), the draw() function continuously executes the lines of code contained inside its block until the program is stopped or noLoop() is called. draw()…

“All Processing programs update the screen at the end of draw(), never earlier.”  
You can print() to the console.

Consider:

```auto
void setup() 
  {
  size(200, 100);
  }

void draw() 
  {
  //Shape 1  
  fill(0);
  ellipseMode(CENTER);
  ellipse(50, 50, 50, 50);
  
  loadPixels(); // Loads pixels[] array with data from display window (Shape 1)
  
  //Shape 2
  println("Something happening here...");
  ellipse(150, 50, 50, 50);
  println("And here");
  
  updatePixels(); // Updates display window with the data in pixels[] (Shape1)
  }

```

References:

> **[loadPixels() / Reference](https://processing.org/reference/loadPixels_.html)**
>
> Loads the pixel data of the current display window into the pixels\[\] array. This function must always be called before reading from or writing to pixels\[\]. Subsequent changes to the disp…

> **[updatePixels() / Reference](https://processing.org/reference/updatePixels_.html)**
>
> Updates the display window with the data in the pixels\[\] array. Use in conjunction with loadPixels(). If you're only reading pixels from the array, there's no need to call updatePixel…

> [@Gabe](#):
>
> The project I’m working on requires this

Can you elaborate on this requirement?

`:)`

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [May 3, 2020, 5:42pm UTC](https://discourse.processing.org/t/drawing-shapes-in-between-loadpixels-and-updatepixels/19991/4 "2020-05-03T17:42:11Z")

</div>

`updatePixels()` will write your pixels buffer back, as you have seen. That is what it is for. Why are you loading – to read values, or to modify values? If you are only calling loadPixels to read values, like `color c = pixels[y*width+x];` then just don’t updatePixels() at all.

```auto
void setup() {
  size(200, 100);
}

void draw() {
  fill(0);
  ellipseMode(CENTER);
  ellipse(50, 50, 50, 50);
  
  loadPixels();
  // why are you loading, anyway?
  // call get() or read pixels[] here
  color c = pixels[mouseY*width+mouseX];
  fill(c);

  // if you didn't set pixels[] or call set(),
  // then don't call:
  // updatePixels();

  ellipse(150, 50, 50, 50);
}

```

For some context see:

[https://processing.org/tutorials/pixels/](https://processing.org/tutorials/pixels/)