SVG模糊在Firefox中非常不稳定

Question

我在图像上使用 svg 模糊滤镜，如下所示

<svg id="blurjs-10">
   <filter id="blur10px">
      <feGaussianBlur stdDeviation="10" in="SourceGraphic">
   </filter>
</svg>

但是Firefox的这种模糊的视觉输出真的很糟糕。

有什么解决办法吗？

Answer 1

我也遇到过这个问题。问题似乎是彩色滤光片计算的精度不够，这会导致色带。

似乎解决问题的解决方案（至少在我的情况下）是使用color-interpolation-filters 来确保在更宽的色彩空间上执行计算。例如：

<feGaussianBlur in="SourceGraphic" stdDeviation="20" color-interpolation-filters="sRGB">

了解了这个属性后，问题及其解决方案就更有意义了。