如何通过js实现canvas保存图片为png格式并下载到本地！

希望能提供示例代码！

---

现成的方案：http://stackoverflow.com/questions/923885/capture-html-canvas-as-gif-jpg-png-pdf

var canvas = document.getElementById("mycanvas");
var img = canvas.toDataURL("image/png");

location = img;

---

看题主标题，应该有两点需求：

1. canvas 保存图片

2. 下载到本地

针对canvas保存图片，bf 童鞋给出了代码了

下载到本地的话，参考这个http://www.alloyteam.com/2014/01/use-js-file-download/

前段时间也捣鼓了一下，列一下我当时的代码片段：

            function base64Img2Blob(code){
                var parts = code.split(';base64,');
                var contentType = parts[0].split(':')[1];
                var raw = window.atob(parts[1]);
                var rawLength = raw.length;

                var uInt8Array = new Uint8Array(rawLength);

                for (var i = 0; i < rawLength; ++i) {
                  uInt8Array[i] = raw.charCodeAt(i);
                }

                return new Blob([uInt8Array], {type: contentType}); 
            }
            function downloadFile(fileName, content){
               
                var aLink = document.createElement('a');
                var blob = base64Img2Blob(content); //new Blob([content]);
              
                var evt = document.createEvent("HTMLEvents");
                evt.initEvent("click", false, false);//initEvent 不加后两个参数在FF下会报错
                aLink.download = fileName;
                aLink.href = URL.createObjectURL(blob);
         
                aLink.dispatchEvent(evt);
            }           
downloadFile('ship.png', canvas.toDataURL("image/png"));