使用Javascript在IE中将画布下载到Image

Question

下面的代码将canvas转换为图像,并在IE以外的浏览器中下载(我使用的是IE9).IE Code在新标签中打开DataURL.但是,它不可下载.

     if(navigator.appName == "Microsoft Internet Explorer")
              {
                  somehtml1= document.createElement("img");
                  somehtml1.id="imgid";somehtml1.name="imgname";
                  somehtml1.src=canvas.toDataURL("image/png");
                  document.body.appendChild(somehtml1);

                  window.win = open (somehtml1.src);
                   setTimeout('win.document.execCommand("SaveAs")', 500);
                     }           
              else
                       {
                             somehtml= document.createElement("a");
 somehtml.href = canvas.toDataURL("image/png");
 somehtml.download = "test.png"; 

}

Answer 1

这就是我正在使用的 - 不确定我使用的IE需要什么版本.它使用blob作为IE和canvas作为其他浏览器的dataURL.在Chrome和IE 11中测试过.

(canvas是canvas对象,link是超链接对象)

           if (canvas.msToBlob) { //for IE
                var blob = canvas.msToBlob();
                window.navigator.msSaveBlob(blob, 'dicomimage.png');
            } else {
                //other browsers
                link.href = canvas.toDataURL();
                link.download = "dicomimage.png";
            }

Answer 2

用户快速简便:只需打开一个显示canvas.toDataURL的新选项卡.

今天的用户了解如何右键单击并保存.

尝试按下它们的"另存为"按钮只会在软件中创建另一个潜在的故障点.[那是我的2美分].

示例代码:

    $("#save").click(function(){
        var html="<p>Right-click on image below and Save-Picture-As</p>";
        html+="<img src='"+canvas.toDataURL()+"' alt='from canvas'/>";
        var tab=window.open();
        tab.document.write(html);
    });

[附加解决方案]

您可以使用FileSaver.js库让用户将画布保存到其本地驱动器.

https://github.com/eligrey/FileSaver.js