右键单击画布时另存为图像

Question

当drawImage()用于在画布元素上绘制某些东西时,画布可以被视为图像吗？

当我右键单击绘制的画布元素时,它会显示"将图像另存为"选项.

这是我看到的右键菜单:

如何使用"保存图像"选项？

Answer 1

所以,这很大程度上取决于浏览器及其工作方式,一般情况下我不建议搞乱这个,但如果你因为某种原因必须让这个工作有一个方法:你可以"简单地"转换<img>每次绘制后画布到元素并<img>改为显示元素.

var canvas = document.getElementById('exampleCanvas'); //Hidden <canvas> element
var imageFoo = document.getElementById('exampleImg'); //Visible <img> element

然后在每次抽奖结束后:

imageFoo.src = canvas.toDataURL();

这里的缺点是你会失去很多速度,所以不要将它用于动画画布或类似的东西.