[英]canvas.drawImage .toDataURL
到目前为止,我已经有了这段代码来为图像添加一些水印并将其绘制到画布上,现在我正尝试将画布数据获取到DataURL,由于某种原因,它无法正常工作
谁能给我个个主意吗? 以及如何修复它并获取其URI数据
这是我的代码
JS
var canvas = document.getElementById('canvas1');
var context = canvas.getContext('2d');
var watermark = new Image();
watermark.src = "http://dummyimage.com/80x80/red/ffffff";
var img = new Image();
img.src = "http://dummyimage.com/500x700/303030/ffffff";
context.drawImage(img, 0, 0);
context.drawImage(watermark,0,0,50,50);
的HTML
<canvas width="500" height="700" id="canvas1"></canvas>
尝试使用context.toDataURL('image/png');
,但不会返回
toDataURL
方法存在于画布上,而不存在于上下文中。
修复后,您将收到的下一个错误是:
Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
该映像必须存在于同一域中才能解决。
您可能还必须预加载图像。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.