Save HTML5 canvas with images as an image

Question

I\'m trying to save a canvas with images to PNG, but when I try this:

var myCanvas = document.getElementById(\"myCanvas\");
var img = document.createElement(         


        

Answer 1

You need to put the window.open call in the load handler since this happens asynchronously.

img.onload = function () {  
    ctx.drawImage(img, 0, 0, myCanvas.width, myCanvas.height);

    var data = myCanvas.toDataURL("image/png");
    if (!window.open(data)) {
        document.location.href = data;
    }
}