Canvas DrawImage not working on Safari iOS

I have a canvas with an identifier called a napkin. When I call the following function, it should draw an image and a swipe canvas onto another canvas in memory. It works in every browser, but iOS Safari. The operation does not seem to exceed the iOS memory cover for the canvas. I check this by calling k (). ToDataURL (). Any ideas?

function k() {
    var canvas = document.createElement('canvas');
    var napkin = document.getElementById("napkin");
    var img = new Image();
    img.src = picurl;
    var ctx = canvas.getContext("2d");
    var imgdata = new Image();
    imgdata.src = napkin.toDataURL();
    canvas.width = img.width;
    canvas.height = img.height;
    ctx.drawImage(img, 0, 0);
    ctx.globalAlpha = 0.5;
    ctx.drawImage(imgdata, 0, 0);
    return canvas;
}
+3
source share
1 answer

You need to wait for the image data to load before using ...

var img = new Image();
img.onload = function(){
    // do stuff here with img
};
img.src = picurl;
// not here
+7
source

All Articles