SVG图片无法在Internet Explorer 11的echarts工具箱中呈现

Question

我正在使用百度echarts图表库创建工具箱。我通过传递指向如下所示的svg图像-'image://<path>'的链接来设置用户定义工具的图标字段。这个东西适用于除IE之外的所有浏览器。 IE版本是11。
我尝试将svg图像加载到DOM元素中，并且在IE中工作正常。它仅与echarts有关。

这是我的工具箱选项的样子-

option = {
toolbox: {
    show: true,
    orient: 'vertical',
    itemSize: 20,
    height:10,
    width:10,
    top: 'center',
    right: '10%',
    feature: {
        myButton: {
            show: true,
            title: '...',
            icon: 'image://sample.svg',
            onclick: function (){
                alert('clicked')
            }
        }
    }
}
};

有人可以帮我吗？

Answer 1

我有解决方案！！！接受我的回答，如果它有用。

IE不支持直接svg文件。它仅支持不带任何颜色的svg路径。因此，我们需要使用以下陡坡来避免这种情况。

例如：

步骤：1 我已拍摄svg图片“ https://upload.wikimedia.org/wikipedia/commons/a/a7/React-icon.svg” 我把它作为按钮图标在除IE之外的所有浏览器中都可以使用。要使图标在所有浏览器中都可以使用

第2步 打开svg文件，仅复制路径。 因此，我计划将其转换为路径。我访问了该网站https://aydos.com/svgedit/

现在，我们有了svg文件的正确路径。但是我们从该网站复制的路径在坐标之间会有空格，因此我们需要将“空格”替换为“，”。

最终步骤 转到：https://convert.town/replace-spaces-with-commas将您导出的代码粘贴到左侧。它会自动在坐标之间添加空格。现在您可以在Echart中使用该路径，它将在所有浏览器中使用。

仅此而已。

在IE中进行采样：