# Using filter() inside of a PGraphics canvas?

**URL:** <https://discourse.processing.org/t/using-filter-inside-of-a-pgraphics-canvas/34878>\
**Category:** Libraries\
**Created:** [January 28, 2022, 10:27pm UTC](https://discourse.processing.org/t/using-filter-inside-of-a-pgraphics-canvas/34878 "2022-01-28T22:27:51Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![CaseyJ](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/caseyj/32/15118_2.png) [@CaseyJ](https://discourse.processing.org/u/CaseyJ)\
**Post date:** [January 28, 2022, 10:27pm UTC](https://discourse.processing.org/t/using-filter-inside-of-a-pgraphics-canvas/34878/1 "2022-01-28T22:27:52Z")

</div>

Learning about using the PGraphics to crate and edit images and graphics before drawing them. Or, in this case, in order to be sent out via Syphon. Syphon is essentially an invisible video cable between different apps on Mac OSX. Spout is the Windows version.

Everything was working great until I started trying to use filter() within the PGrahics canvas.

The peculiar thing is that the filters used, INVERT & BLUR, do show in the Processing window but not in the Syphon output.

Is there any reason for this and/or a fix?

Should the filters be applied in a different way to ensure they are included in the Syphon output?

See attached screenshot and code below.

Find the library and the “Simple Client” app on the [GitHub here.](https://github.com/Syphon)

```auto
import codeanticode.syphon.*;

PGraphics canvas;
SyphonServer server;

void setup() { 
  size(400,400, P3D);
  canvas = createGraphics(400, 400, P3D);
  frameRate(30);
  
  // Create syhpon server to send frames out.
  server = new SyphonServer(this, "Processing Syphon");
}

void draw() {
  canvas.beginDraw();
  canvas.background(127);
  canvas.lights();
  canvas.translate(width/2, height/2);
  canvas.rotateX(frameCount * 0.01);
  canvas.rotateY(frameCount * 0.01);  
  canvas.box(150);
  canvas.filter(INVERT);
  canvas.filter(BLUR, 3);
  canvas.endDraw();
  image(canvas, 0, 0);
  server.sendImage(canvas);
}

```

 ![Screen Shot 2022-01-28 at 3.19.44 PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/b/bf202675a156c8fe9f94c9480f3f552698f3d5d8.jpeg)

---

<div class="post-metadata">

**Author:** ![th75](https://avatars.discourse-cdn.com/v4/letter/t/ebca7d/32.png) [@th75](https://discourse.processing.org/u/th75)\
**Post date:** [January 29, 2022, 6:15pm UTC](https://discourse.processing.org/t/using-filter-inside-of-a-pgraphics-canvas/34878/2 "2022-01-29T18:15:31Z")

</div>

Hi,

i tried your code, and it works well on my computer

so i can’t help much, may be it s about when the filters are really applied  
( i assumed it was at endDraw but may be at the end of draw() loop)  
so i will try an `canvas.updatePixels();` before server.sendImage(canvas);

 ![syphon](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/e/ecfdf3b3ad97457b73492b10c30e94de6c8dbc45.jpeg)

---

<div class="post-metadata">

**Author:** ![CaseyJ](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/caseyj/32/15118_2.png) [@CaseyJ](https://discourse.processing.org/u/CaseyJ)\
**Post date:** [February 1, 2022, 7:36pm UTC](https://discourse.processing.org/t/using-filter-inside-of-a-pgraphics-canvas/34878/3 "2022-02-01T19:36:40Z")

</div>

Well that is strange thank you for the update though!

I notice in your console there are no red errors. I do have them.

It is usually caused by not having the frameRate() function in there.

Perhaps there is a difference between machines enough to cause this?

MacBook Pro Mid 2015  
OS 11.5.1  
Processing 3.5.4  
Syphon v 3.0

 ![Screen Shot 2022-02-01 at 12.33.50 PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/5/5e958d858691e95b8c3511f3d18a67e9b7bfbba3.png)

---

<div class="post-metadata">

**Author:** ![th75](https://avatars.discourse-cdn.com/v4/letter/t/ebca7d/32.png) [@th75](https://discourse.processing.org/u/th75)\
**Post date:** [February 2, 2022, 3:26pm UTC](https://discourse.processing.org/t/using-filter-inside-of-a-pgraphics-canvas/34878/4 "2022-02-02T15:26:18Z")

</div>

hi,  
yes i had those same red errors on my macbook 2013, i recently switched to a m1 and i don t have them anymore  
M1  
Processing 3.5.4  
syphon … i don 't know, i use current “simple client” app  
anyhow it 's quite unlikely problem is on syphon side  
i will try to put `server.sendImage(canvas);` just after draw()  
so you sent the previous frame “canvas” image, after it was rendered, i think problem is about when do filter() and image(,) are really applied

```auto
void draw() {
 server.sendImage(canvas);
  canvas.beginDraw();
 ...
}

```