相关疑难解决方法(0)

我有以下SVG文件：

  <svg preserveAspectRatio="xMinYMin meet" viewBox="0 0 21 484" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <filter id="dropShadow">
      <feDropShadow dx="4" dy="0" stdDeviation="4"></feDropShadow>
    </filter>
  </defs>
  <g id="Artboard" stroke-width="5" stroke="#FF0000" fill="#000000" stroke-linecap="round">
    <path style="filter: url(#dropShadow)" d="M7.5,8.5 L7.5,471.5" id="path-1"></path>
  </g>
</svg>

在Firefox中，当我打开SVG文档时，它仅显示一条非常细的（不是5宽）垂直线。在Chrome中，它不会显示任何内容（在codepen中也不会显示任何内容，在这里：https ://codepen.io/jwir3/pen/BJBqEK ）。

我不太确定自己在这里做错了什么，但这与过滤器有关，因为如果我filter: url(#dropShadow)从path定义中删除，则该行将按预期显示。