Xml svg使用来自另一个文件的过滤器
我正试图定义几个过滤器,但不希望它们扰乱主HTML文档。我想使用相对URI引用那些使用相对IRIs的过滤器 过滤器.svgXml svg使用来自另一个文件的过滤器,xml,svg,xlink,Xml,Svg,Xlink,我正试图定义几个过滤器,但不希望它们扰乱主HTML文档。我想使用相对URI引用那些使用相对IRIs的过滤器 过滤器.svg <?xml version="1.0"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg xmlns="http://www.w3.org/2000/svg"> <
<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg">
<defs>
<filter id="blur" x="-100%" y="-100%" width="300%" height="300%">
<feGaussianBlur in="SourceGraphic" stdDeviation="8" />
</filter>
</defs>
</svg>
page.html
<!DOCTYPE html>
<html>
<head>
<meta chartype="utf-8" />
<title>Remote Filter Loading</title>
</head>
<body>
<svg
id="blurs"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<defs>
<use xlink:href="filters.svg#blur"></use>
</defs>
<circle cx="50" cy="50" fill="red" r="25"
filter="url(filters.svg#blur)"
/>
<circle cx="100" cy="50" fill="red" r="25"
filter="url(#blur)"
/>
</svg>
</body>
</html>
远程过滤器加载
在Chrome中,使用python-m SimpleHTTPServer提供这些服务,我希望看到两个模糊的小点:
(通过将过滤器直接粘贴到defs中生成,我认为
做到了。)
我得到的是:
以后
正如@Jason Aller指出的,这在Chrome中不受支持。正如我提到的,我的过滤器在Firefox上似乎不起作用。是否有任何可能的解决方法将(实际图像有几个,而且它们相当复杂)保存在一个单独的文件中?在查看和测试后,我可以看到它在Firefox中工作,但在Chrome中不工作。很好,谢谢。太糟糕了,我正在运行的复杂过滤器在Firefox中无法正确渲染。那#辉光应该是#模糊吗?是的-最初的尝试是星型辉光过滤器,这里简化为普通模糊。错误仍然存在。嗨@DavidSouther,我正在尝试处理相同的问题。你有没有找到一个好的跨浏览器解决方案?