Using p5.js to generate SVG markup from a module

Hello all! I am an experienced web developer who is brand new to p5.js and generative art in general. I’ve spent several hours searching around for an answer to this question, and I suspect I am just thinking about this the wrong way.

I want to use p5.js to generate an SVG image, capture the SVG markup text, and then use that string as a variable a React application.

I’m using p5.js-svg to generate the SVG image, and I’ve been able to capture the SVG markup using getDataURL(). I’d like to be able to wrap this in a module with a function like ‘generateImageMarkup()’, but when I do so I get this error: “ReferenceError: window is not defined”.

It seems like I am trying to force this library to do something it’s not designed to do. What is the right way to approach this problem? What is the p5.js-native approach?

Hi @blundin,

Maybe the easiest way would be that you setup a sample sketch in P5js Web Editor on which you try to reproduce this issue than one can have a look…
Such generic errors can’t be analysed depending on your description above as it can have several reasons why this error is thrown…

— mnse

1 Like