jquery - 缩放后 svg 过滤器在 mozilla firefox 中不起作用

Question

我有一个动态的 d3.js 树，我在点击时对元素应用辉光滤镜。当我缩放树并单击任何节点时，元素会隐藏而不是突出显示。这只发生在 Firefox 中。在 Chrome 中，它工作正常。

<filter id="yellow-glow" x="-5000" y="-5000" width="10000" height="10000" filterUnits="userSpaceOnUse">
  <feFlood result="flood" flood-color="yellow" flodd-opacity="1"/>  
  <feComposite in="flood" result="mask" in2="SourceGraphic" operator="in"/>
  <feMorphology in="mask" result="dilated" operator="dilate" radius="2"/>
  <feGaussianBlur in="dilated" result="blurred" stdDeviation="5"/>
  <feMerge><feMergeNode in="blurred"/>
  <feMergeNode in="SourceGraphic"/></feMerge>

这是 working demo

Answer 1

当你减小过滤器的尺寸时它工作正常

<filter id="yellow-glow" x="-500" y="-500" width="1000" height="1000"

我猜 Firefox 的 SVG 渲染器中有些东西溢出了。您可能想向 Mozilla 提交错误。