Internet explorer 对象HTMLImageElement不能为"；另存为；Internet Explorer中的图像

我尝试：使用D3创建一个SVG元素，单击一个按钮，使用画布将其转换为一个图像，这样就可以右键单击并“另存为”图像

问题：Internet Explorer无法将[object HTMLImageElement]对象作为“图像”显示，因此当我右键单击它时，它不会提示“将图像另存为…”选项。在Chrome和Firefox中工作正常

我有以下HTML代码：

<input type="button" id="toPngBtn" value="Save" /><br />
<div id="myDiv"></div>
<div id="exportDiv"></div>

提示下载文件，但Internet Explorer不允许CORS，因此无法工作。。。关于如何使SVG中的图像可以在IE中下载，有什么想法吗？

---

谢谢。

Internet Explorer不支持锚定标记上的

下载属性。
因此，对于Internet Explorer，您可以尝试以下代码

window.navigator.msSaveBlob(canvas.msToBlob(), "svg-graph.png");

完成的代码：

function isIE() {
  var userAgent = window.navigator.userAgent;
  return userAgent.indexOf("MSIE ") > -1 || userAgent.indexOf("Trident/") > -1;
}
image.onload = function () {
   context.drawImage(image, 0, 0);
   if(isIE()){ 
      window.navigator.msSaveBlob(canvas.msToBlob(), "svg-graph.png");
   } else{
      var a = document.createElement("a");
      a.download = "svg-graph.png";
      a.href = canvas.toDataURL("image/png");
      a.click();
   }
};

Internet Explorer不支持锚定标记上的
下载
属性。
因此，对于Internet Explorer，您可以尝试以下代码

window.navigator.msSaveBlob(canvas.msToBlob(), "svg-graph.png");

完成的代码：

function isIE() {
  var userAgent = window.navigator.userAgent;
  return userAgent.indexOf("MSIE ") > -1 || userAgent.indexOf("Trident/") > -1;
}
image.onload = function () {
   context.drawImage(image, 0, 0);
   if(isIE()){ 
      window.navigator.msSaveBlob(canvas.msToBlob(), "svg-graph.png");
   } else{
      var a = document.createElement("a");
      a.download = "svg-graph.png";
      a.href = canvas.toDataURL("image/png");
      a.click();
   }
};

出于安全原因，在IE

），在画布上绘制svg图像确实会污染画布

因此，当右键单击绘制的画布时，您将无法再访问

图像另存为…

功能

但是，在这些浏览器中，您只需右键单击原始svg元素并选择

将图像另存为…

=>

yourFile.png

因此，解决方案是首先尝试在画布上呈现svg，然后在try-catch块中调用其

toDataURL（）

方法，或者执行一些UA字符串欺骗，并直接向用户发送一些通知，让用户右键单击图像并自己执行操作

---

请注意，即使画布被污染，在您的情况下也与跨源资源无关。

在画布上绘制svg图像确实会在IE），这是出于安全原因

因此，当右键单击绘制的画布时，您将无法再访问

图像另存为…

功能

但是，在这些浏览器中，您只需右键单击原始svg元素并选择

将图像另存为…

=>

yourFile.png

因此，解决方案是首先尝试在画布上呈现svg，然后在try-catch块中调用其

toDataURL（）

方法，或者执行一些UA字符串欺骗，并直接向用户发送一些通知，让用户右键单击图像并自己执行操作

---

请注意，即使画布受到污染，也与您的跨源资源无关。

我很想对其进行升级，因为我不知道IE的

navigator.msSaveBlob

方法，但如果画布受到污染（在IET中绘制svg时会出现这种情况非常感谢。这是我们一直以来遇到的问题的解决方案。这实际上是将D3.js图形保存到PNG的解决方案。我很想对它进行升级，因为我不知道IE的

navigator.msSaveBlob

方法，但是如果画布被污染了（在IET中绘制svg时会出现这种情况非常感谢。这是我们一直以来遇到的问题的解决方案。这实际上是将D3.js图形保存到PNG的解决方案。您知道IE 11用户报告没有“将图片另存为”选项的原因吗通过右键单击svg元素？该选项似乎适用于一个用户，但不适用于另一个用户，即使两个用户都有相同的IE版本。@Dave，不，我不知道，真的很抱歉，如果你发现了，我很高兴听到原因。可能是一些插件或防病毒软件。你知道IE 11用户报告没有使用该选项的任何原因吗通过右键单击svg元素“将图片另存为”？该选项似乎只适用于一个用户，但不适用于另一个用户，即使两个用户都有相同的IE版本。@Dave，不，我不知道，真的很抱歉，如果你发现了，我很高兴听到原因。可能是一些插件或防病毒软件？