Is there any reliable way to use ctx.drawImage() in IE11?

问题

I have a script that creates dynamic SVG graphics from a data query. I need to stick 'em in a PDF, I'm using jsPDF for this. Unfortunately, jsPDF's own addSVG doesn't seem to work so I've spent some time trying to convert the SVGs to PNGs, using canvas.

I seem to be getting the SVG data URI plugged into an img object ok, but when I try to draw it to the canvas, I get the 'unexpected property or method' error in IE11.

I've tried the following:

img.onload = function () {
    ctx.drawImage(img,0,0);
}

img.onload = function () {
    try {
        ctx.drawImage(img,0,0);
    }
    catch (err) {
        setTimeout(ctx.drawImage(img,0,0),1);
    }
}

img.addEventListener("load", function () {
    ctx.drawImage(img,0,0);
}

img.addEventListener("load", function () {
    try {
        ctx.drawImage(img,0,0);
    }
    catch (err) {
        setTimeout(ctx.drawImage(img,0,0),1);
    }
)}

The last one seems to be the most reliable and using addEventListener comes right from the MSDN; however it will still occasionally throw the same error. I've also taken to declaring my canvas in my html directly, and I've tried various times for setTimeout().

Is there any foolproof way to make sure this works in IE11?

edit: To clarify, var ctx = canvas.getContext('2d') is only a line or two above img.onload or img.addEventListener. Interestingly the MSDN doc here has ctx declared inside, i.e. img.addEventListener("load", function () { var ctx = canvas.getContext('2d'); ... }

The error is always 0x8000ffff - JavaScript runtime error: Unexpected call to method or property access. and the debugger highlights the ctx.drawImage line.

来源：https://stackoverflow.com/questions/32891343/is-there-any-reliable-way-to-use-ctx-drawimage-in-ie11