Canvas入门基础(八):保存文件

2018-06-19 14:40 更新
        在canvas中绘出的图片只是canvas标签而已,并非是真正的图片,我们并不能保存,不过我们可以利用canvas.toDataURL()这个方法把canvas绘制的图形生成一幅图片,生成图片后,就能对图片进行相应的操作了。
首先我们定义用一个a标签定义下载的链接,然后再给a设置下载的链接。

<a id="download" download="aa.png">下载</a>


var imageURL=canvas.toDataURL("image/jpeg")

//当然,你也可以动态的设置下载的文件名

document.getElementById("download")setAttribute("download","abc.png");

document.getElementById("download").href=imageURL;

当然,我们也可以保存为另外的图片格式:image/png

注意:toDataURL() 是canvas的方法

注意:a的download属性只有 Firefox 和 Chrome 支持 download 属性。


以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号