CODEWITHSUNDEEP
javascriptjqueryhtml2canvasfilesaver.js
ticklishoctopus
ticklishoctopus

Reputation: 73

html2canvas + FileSaver browser issues

I'm currently working with html2canvas and FileSaver, to save the generated canvas when the button is clicked. A dialog will popup and the user can choose where to save the image and rename it if they wish. It works perfectly... in Firefox. I can't seem to get it to work in either Chrome, IE, or Safari.

The html2canvas will do its part, and create the image out of the div in all of those browsers. The FileSaver dialog box is the thing that will not work in the aforementioned browsers.

Any ideas? I've attached my script. You can see my full working code here: https://jsfiddle.net/ticklishoctopus/556etja4/

Script (with some help from previous SO posts):

$(function () {
    $("#btnSave").click(function () {
       html2canvas($("#testbtn"), {
           onrendered: function (canvas) {
               theCanvas = canvas;
               document.body.appendChild(canvas);

               canvas.toBlob(function (blob) {
                   saveAs(blob, "testimage.jpg");
               });
            }
         });
     });
});

Upvotes: 1

Views: 1654

Answers (1)

ZombieChowder
ZombieChowder

Reputation: 1204

Realised toBlob is not supported in Chrome. Use this instead: Possible Solution

Upvotes: 0

Related Questions