Question

I am trying to draw an image onto canvas. The image is within the folder as of html file. But when i call the drawImage() function, the image doesn’t draw. Here is my code,

var upcan = document.createElement("canvas");
upcan.width = "190";
upcan.height = "380";
upcan.style.cssText = 'border-radius:25px; '
var upctx = upcan.getContext('2d');

var pb = new Image();

pb.onload = function() {
upctx.drawImage(pb,0,0,100,400);
};
pb.src = "photobooth.png";
var canvasData = upcan.toDataURL("image/png");

Answer 1

The problem was in upcan.toDataURL(“image/png”);. It doesn’t draw an image that is sourced from outside, due to security reasons.