p5JS server side render - using node-canvas

p5.js Coding Questions
1

I’d like to render images from a P5 script, for preview thumbnails. Has someone got advice on that?
The node-canvas library would seem to be a good fit for this, but not sure how p5 deals with things like the event loop - calling the draw() and setup() is a bit more than just a single call to canvas render.

Does anyone have an example?

I saw this

2

Hi! Welcome to the forum!

Can you be a bit more specific about what you’re trying to do? Are you trying to generate a static image? A gif?

Although I haven’t tried, a quick search shows this npm package - would this work for you, and if not, what would be an issue?

3

just tried the package, it seems to work fine (at least for saving a static image) but surprised that the dependencies add up to 100MB - still it’s an impressive work.

4

thanks, yes I did end up using that. It loads in all of JSDOM which is a whole headless browser server side hence the huge deps. I was really looking for a more lean and mean solution just using node-canvas, which is a drawing surface.
But P5 is not just code for drawing, with the render loop and other elements it seems to expect to have it’s own little mini-runtime to run in. I guess I can call draw() and setup() imperatively and get what i want… maybe?

5

Well, again, you need to specify what you want :slight_smile:

I’m not sure if you can modify the package or inject code to the sketch to pause draw (you can always noLoop to do so). But I don’t know your exact use case so I cannot suggest anything - for example, do you have a sketch to run only the draw loop once? Or do you want the loop for specific times? Do you have multiple sketches?