CODEWITHSUNDEEP
jqueryimagecanvas
Thiago Belem
Thiago Belem

Reputation: 7832

Export image with canvas

I'm creating an application (based only on HTML, CSS and jQuery) where I will create an image based on layers (just a bunch of divs one above each other) and then I will need to export it, so the user can download the final version as JPG or PNG.

There's any way to export the canvas content as a downloadable image?

Upvotes: 1

Views: 1078

Answers (2)

Sune Rasmussen
Sune Rasmussen

Reputation: 954

As far as I know, you cannot make the browser download a file it's generated itself.

However, you can use the canvas element's Canvas.getDataURL() method. It returns the image data, as a base64 encoded PNG. You could upload this to your server with Ajax, have the server convert it to a normal PNG file again (or even another file type), and then have the client download the image from the server.

I know it's a litte strange way around the problem, but should be easily done.

Upvotes: -1

slothy
slothy

Reputation: 373

canvas.toDataURL()

also see:

canvas.toBlob()

Upvotes: 2

Related Questions