# Q: Can't make screenshot thumbnail on OpenProcessing.org when showing Cindy.js colorplot

**URL:** https://discourse.processing.org/t/q-cant-make-screenshot-thumbnail-on-openprocessing-org-when-showing-cindy-js-colorplot/47059
**Category:** Libraries
**Created:** [August 31, 2025, 9:09pm UTC](https://discourse.processing.org/t/q-cant-make-screenshot-thumbnail-on-openprocessing-org-when-showing-cindy-js-colorplot/47059 "2025-08-31T21:09:57Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![Raj](https://avatars.discourse-cdn.com/v4/letter/r/c0e974/32.png) [@Raj](https://discourse.processing.org/u/Raj)
#### Post date: [August 31, 2025, 9:09pm UTC](https://discourse.processing.org/t/q-cant-make-screenshot-thumbnail-on-openprocessing-org-when-showing-cindy-js-colorplot/47059/1 "2025-08-31T21:09:57Z")

</div>

I’ve been experimenting with incorporating the geometry and math library Cindy.js into OpenProcessing sketches. That works ok, but I don’t seem to be able to make preview-thumbnail screenshots when I show a 2D colorplot. It does work fine when I simply show an x,y plot.

This sketch illustrates the point:

[https://openprocessing.org/sketch/2711694](https://openprocessing.org/sketch/2711694)

Weirdly, I was able to make thumbnail screenshots, and indeed thumbnail videos, just a couple of weeks ago. E.g. this one:  
[https://openprocessing.org/sketch/2703546](https://openprocessing.org/sketch/2703546)

Did something change recently in the way OpenProcessing makes thumbnail screenshots?

Many thanks,

Raj

---

<div class="post-metadata">

### Author: ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)
#### Post date: [September 2, 2025, 7:35am UTC](https://discourse.processing.org/t/q-cant-make-screenshot-thumbnail-on-openprocessing-org-when-showing-cindy-js-colorplot/47059/2 "2025-09-02T07:35:58Z")

</div>

In you html file you have 2 `</body` tags but that would not cause the issue.

I tried many ways to get a thumb nail and eventually I did manage it, check out my sketches [here](https://openprocessing.org/user/1623?view=sketches)

I am not sure how I did it but when I tried your sketch I got the message

> InvalidStateError: CanvasRenderingContext2D.drawImage: Passed-in canvas is empty

and the screen froze during the capture and I could not get back to the code view without refreshing the browser window. I also tried a video thumbnail.

Eventually I had the old plot nail in my sketches window but when I opened the sketch and went to edit the color nail was there so I submitted the edit again and it appeared to work.

I am not sure exactly the procedure because it was all hit and miss but at least you know it is possible 🙂

---

<div class="post-metadata">

### Author: ![Raj](https://avatars.discourse-cdn.com/v4/letter/r/c0e974/32.png) [@Raj](https://discourse.processing.org/u/Raj)
#### Post date: [September 2, 2025, 3:16pm UTC](https://discourse.processing.org/t/q-cant-make-screenshot-thumbnail-on-openprocessing-org-when-showing-cindy-js-colorplot/47059/3 "2025-09-02T15:16:15Z")

</div>

Thanks for looking into this, and experimenting!

From googling the “Passed in canvas is empty” error message, it sounds like the fact that an image is visibly showing up on screen is not enough for the screenshot-making-code. This might be something to do with the way Cindy.js renders images onto the canvas? I’m not sure.

I’ll try asking the Cindy.js guys (the “Issues” section of their github page sort of serves as a user forum), and I’ll let you know what I find out.

Thanks again. I love the sketches that you have on OpenProcessing, by the way!

Raj

---

<div class="post-metadata">

### Author: ![Raj](https://avatars.discourse-cdn.com/v4/letter/r/c0e974/32.png) [@Raj](https://discourse.processing.org/u/Raj)
#### Post date: [September 9, 2025, 5:22pm UTC](https://discourse.processing.org/t/q-cant-make-screenshot-thumbnail-on-openprocessing-org-when-showing-cindy-js-colorplot/47059/4 "2025-09-09T17:22:37Z")

</div>

Update: for reasons that I don’t understand at all, video thumbnails turn out to work on Cindy.js-importing sketches, even though trying to make static thumbnails results in hanging and failure.

(I paid for OpenProcessing membership, so I can make video thumbnails).

Here’s my sketches thumbnails page with the Cindy.js Mandelbrot zoom thumb showing as a video:  
[https://openprocessing.org/user/431622#sketches](https://openprocessing.org/user/431622#sketches)

---

<div class="post-metadata">

### Author: ![msawired](https://avatars.discourse-cdn.com/v4/letter/m/c2a13f/32.png) [@msawired](https://discourse.processing.org/u/msawired)
#### Post date: [September 10, 2025, 11:43am UTC](https://discourse.processing.org/t/q-cant-make-screenshot-thumbnail-on-openprocessing-org-when-showing-cindy-js-colorplot/47059/5 "2025-09-10T11:43:01Z")

</div>

Hello! Raphael informed me about this topic. Yes, I can see the issue there. I am not sure why, as it seems like a standard canvas element, but somehow the image extraction from it doesn’t work. I am suspecting cindy.js is using a custom context for it, but I have to dig in to this further. In general, OpenProcessing focuses on p5js sketches, and it is not meant to handle all custom canvas use-cases. I can look at this in the coming weeks but I can’t promise a timeline.