SVG 图像不会在 Internet Explorer 11 的 echarts 工具箱中呈现

Question

我用的是百度echarts图表库做的工具箱。我通过将 link 传递给看起来像这样的 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.To 以外的所有浏览器中都有效使图标在所有浏览器中都有效

步骤 2 打开svg文件，只复制路径。所以我打算把它转换成路径。我访问了这个网站 https://aydos.com/svgedit/

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

最后一步 Goto :https://convert.town/replace-spaces-with-commas 将导出的代码粘贴到左侧。它会自动在坐标之间添加 space。现在你可以在 Echart 中使用该路径，它将在所有浏览器中工作。

仅此而已。

IE 中的示例：

SVG 图像不会在 Internet Explorer 11 的 echarts 工具箱中呈现

SVG image doesn't render in echarts toolbox in Internet Explorer 11

javascript

internet-explorer

svg

echarts