【发布时间】：2021-03-24 03:49:44
【问题描述】：
我有一个简单的 SVG 元素（一个圆圈），应用了湍流和置换贴图过滤器，以创建水效果。我还应用了一个遮罩，它隐藏了一部分形状。问题是这样的：即使在遮罩的黑色区域中，仍然显示部分形状：过滤器导致图像在某些区域扩大到其正常边界之外，这些区域甚至出现在应该被蒙面。此问题仅存在于 Chrome 和 Chromium 中，而不存在于 Firefox 中。这个问题可以在行动here 中看到。有问题的对象是底部的红色圆圈 - 过滤器扭曲并扩展它，这个扩展区域甚至显示在应该被遮蔽的区域（屏幕的上半部分）。
【问题讨论】：
-
如果您认为自己发现了 Chrome 错误，请将其报告给 Chrome 的错误跟踪器
-
您是对的，根据规范filters should be applied before masks 要解决浏览器中的错误，请将滤镜效果应用于元素，然后将其包装在一个组中并将蒙版应用于该组。
-
Chrome/Mac 上不会出现问题 - 所以可能是 Windows 特定的错误，甚至可能是 GPU 特定的错误
-
我在 OpenSUSE Linux 上运行 Chromium
标签： svg svg-filters