来自不同svg文件的参考过滤器

Question

如何引用在不同文件中定义的过滤器？例如，文件夹filter.svg中有assets，其中包含：

<svg xmlns="http://www.w3.org/2000/svg">
  <defs>
    <linearGradient id="gradient">
      <stop offset="20%" stop-color="#39F" />
      <stop offset="90%" stop-color="#F3F" />
    </linearGradient>
  </defs>
</svg>

现在在另一个文件中，我在另一个svg元素中绘制了一些形状。如何应用此渐变滤镜？简单地说：fill="url(assets/filter.svg#gradient)"？因为看起来它没有拿起定义。

Answer 1

如评论中所示，Chrome（仍然！）不支持引用外部文件中定义的过滤器，填充，描边，剪辑路径，蒙版或标记，如Chrome v45。

请参阅似乎正在跟踪此问题的this bug report。

这方面似乎也有webkit bugs，所以虽然我自己没有测试过，但我认为其他基于webkit的浏览器也可能有这个限制。