P5.js: Load base64 images returned by a function call within p5.js

[abdullahzameek]

[x] New feature request

[x] Image

New feature details:

So, I'm working with a Javascript library called gaborgen.js. A function, gaborgen(x,y) returns a base64 image(or you could just return the matrix itself without constructing the image).
I want to be able to generate multiple different images, load them in p5.js and then display them on the canvas after positioning them in a certain way.

Is there any way load images that have no file path per se, and come about as the output of a function call? It'll be really convenient if p5.js had functionality to load generated images like these within the sketch and then manipulate and display them on the canvas.

Thanks in advance!

[lmccart]

this should do it.. you first create a native JS Image() then load it into a p5.Image() so it has all the p5 capabilities.
```javascript
var img;
var raw = new Image();
raw.src='data:image/jpeg;base64,/9j/4AAQSkZJRg...'; // base64 data here
raw.onload = function() {
img = createImage(raw.width, raw.height);
img.drawingContext.drawImage(raw, 0, 0);
image(img, 0, 0); // draw the image, etc here
}

[KevinWorkman]

If you post your question to multiple sites, please link between them so we know what help you've already received. This question has also been answered here:

https://stackoverflow.com/a/51162033/873165