SVG 过滤器对于直线无法正常工作

问题描述

<svg height="210" width="500">
  <defs xmlns="http://www.w3.org/2000/svg">
    <filter id="dropshadow" height="130%">
      <feGaussianBlur in="SourceAlpha" stdDeviation="3" />
      <feOffset dx="2" dy="2" result="offsetblur" />
      <feMerge>
        <feMergeNode/>
        <feMergeNode in="SourceGraphic" />
      </feMerge>
    </filter>
  </defs>
  <line x1="0" y1="100" x2="200" y2="100" style="stroke:rgb(255,100,90);stroke-width:3px" filter="url(#dropshadow)" />
</svg>

我试图在一条直线上使用阴影，但它隐藏了这条线本身.如果我使用对角线，它可以正常工作.

I am trying to use shadow in a straight line, but it's hiding the line itself. If I use diagonal line it works properly.

推荐答案

尝试替换部分并放入 style="stroke:rgb(255,0,0);stroke-width:2"

这篇关于SVG 过滤器对于直线无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！