CODEWITHSUNDEEP
jqueryhtmlhtml5-canvas
santBart
santBart

Reputation: 2496

jquery canvas image download

I have my canvas element and some div, which after clicking I wish open downloading the "canvas snapshot". Over now I have:

$("#save").live('click', function(e)
{
    var image = canvas.toDataURL("image/png", true); 
    var imageElement = document.getElementById("myPics");
    imageElement.src = image;
 });

What displays the Image - so it is ok, but what I want is formula which will cause automatic download of this picture to users computer, after clicking #save div.

Upvotes: 3

Views: 4046

Answers (1)

Mikko Ohtamaa
Mikko Ohtamaa

Reputation: 83348

The saving of the image can be done using HTML5 blobs.

http://www.html5rocks.com/en/tutorials/file/filesystem/#toc-file-writing

You can get Blob out of the <canvas> like done in this code:

https://github.com/miohtama/Krusovice/blob/master/src/tools/resizer.js

Upvotes: 2

Related Questions