将画布(canvas)图像保存成本地图片的方法
之前我曾介绍过如何将HTML5画布(canvas)内容转变成图片形式，方法十分简单。但后来我发现只将canvas内容转变成图片输出还不够，如何能将转变后的图片保存到本地呢？
其实，这个方法也是非常简单的，几乎不用额外的编程知识。但我们可以更完美些，下面我将使用canvas2image.js, base64.js这两个脚本实现更强大的canvas->图片->本地的过程。
在下面的方框内你可以用鼠标绘制任意的图案，试一下吧，然后点击“保存…”按钮，浏览器将会提示你保存下载图片。或者点击”转换成…”，然后右键点击画布，可以看到浏览器右键菜单里有“保存图片..”一项。
使用HTML5画布技术，你可以在浏览器客户端用JavaScript绘制出各种美丽酷炫的图案，这些图案是不能直接保存的，本身也不是图片形式。
幸运的是，画布(canvas)对象有一个非常有用的方法:toDataURL()。这个方法能把画布里的图案转变成base64编码格式的png，然后返回 Data URL数据。
var strDataURI = oCanvas.toDataURL(); // returns "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACt..."
而且，如果你给toDataURL()传入mine类型的参数，你还可以将画布转变成其它格式的图片。
var strDataURI = oCanvas.toDataURL("image/jpeg");
// returns "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAA..."
现在，有了 Data URL数据后，我们可将这些数据直接填充到<img> 元素里，或者我们可以直接从浏览器里下载它们。
上面我提到的两个js包也就是封装了一些方便的方法：
/*
* Canvas2Image.saveAsXXXX = function(oCanvasElement, bReturnImgElement, iWidth, iHeight) { ... }
*/
var oCanvas = document.getElementById("thecanvas");
Canvas2Image.saveAsPNG(oCanvas); // 这将会提示用户保存PNG图片
Canvas2Image.saveAsJPEG(oCanvas); // 这将会提示用户保存JPG图片
Canvas2Image.saveAsBMP(oCanvas); // 这将会提示用户保存BMP图片
// 返回一个包含PNG图片的<img>元素
var oImgPNG = Canvas2Image.saveAsPNG(oCanvas, true);
// 返回一个包含JPG图片的<img>元素
var oImgJPEG = Canvas2Image.saveAsJPEG(oCanvas, true);
// 返回一个包含BMP图片的<img>元素
var oImgBMP = Canvas2Image.saveAsBMP(oCanvas, true);
// 这些函数都可以接受高度和宽度的参数
// 可以用来调整图片大小
// 把画布保存成100x100的png格式
Canvas2Image.saveAsPNG(oCanvas, false, 100, 100);
你也许注意到了saveAsBMP这个函数，实际上没有浏览器直接支持转化成BMP格式，但我们可以借用getImageData()方法实现对它的支持，这个方法提供给我们从画布里直接读取原始像素的功能。
有了这些数据，我们可以构造出BMP格式图片(这种格式非常的简单)。
对于大个的图片，转化成BMP格式会需要几秒钟的时间，但小图片就非常的快了，不会有延迟的感觉。
您好，请问下如果我要修改图片的名字该怎么办呢？
这个问题我也想知道
您好，请问文章中所提及的两个JS文件在哪里可以获得？
点一下
ie9不支持吗？
支持，亲!
为什么拿别人的文章不加转载说明
为什么我自己把两张图片放在画布里面然后合成保存成一张图片出来的是黑白的
你好，为什么我下载jpeg的图片，但是下载下来的文件没有后缀名的？而且文件名字就是“下载” 文件名可以重命名么？
下载的图片还需要自己修改后缀名才行，有点麻烦哦
你好，有存成GIF的方法么？
不能在手机端使用，怎么保存到手机相册
你好，大神，那两个js代码链接没用了，你可以给我那两个文件吗？我想学习一下 感谢
里面有背景图片就下载不了！
如何加下载的文件命名？
…..
点击画框不能用鼠标画画，而且求楼主发一下那两个js代码文件，鄙人想学习一下 谢谢楼主
如何保存到指定的文件夹
能发下两个js 文件么
JS不见了???发下可好？
就写了一半 没头没尾 不好看啊