在SVG直线上应用滤镜会使线条消失-讨论泛色滤镜的解决方法

Question

我怀疑这可能与SVG Mask makes line disappear有关 但是上述问题是关于屏蔽的，这个问题是关于过滤器的，并且上面给出的答案中的文档已删除-https://www.w3.org/TR/SVG/masking.html#Masking

我有一条直路：

<path stroke="red" stroke-width="40" fill="transparent" d="M400 -2800 H400 V-4400" filter=""></path>

我正在应用这样定义的过滤器：

  <filter id="f1">
    <feColorMatrix in="SourceGraphic"
        type="matrix"
        values="0 0 0 0 0
                1 1 1 1 0
                0 0 0 0 0
                0 0 0 1 0" />
  </filter>

该行将消失。

我认为这是由于objectBoundingBox无法计算垂直直线的宽度。

我想获得的效果是更改悬停时线条的颜色。

我知道这可以在CSS中完成，但是我想考虑在应用效果方面更加灵活的可能性。

如何使用过滤器“填充”线/路径的颜色，从而计算出元素的计算几何形状的笔触？

在性能方面，您还可以建议我如何使用浏览器控制台检查过滤器对仅使用CSS类进行渲染VS的影响吗？