我有一个简单的SVG: https://jsfiddle.net/5xn7r9t2/
<svg id="sankey-scoring" preserveAspectRatio="xMinYMin" height="420px" viewBox="0 0 400 420">
<defs>
<linearGradient id="gradient-1-0">
<stop offset="0" stop-color="#ecce3c"></stop>
<stop offset="1" stop-color="#e1243f"></stop>
</linearGradient>
</defs>
<g>
<path class="link" d="M250,111C275,111,275,111,300,111" style="stroke: url(#gradient-1-0); stroke-width: 222;">
<title>3</title>
</path>
<path class="link" d="M250,326C275,326,275,296,300,296" style="stroke: url(#gradient-1-0); stroke-width: 148;">
<title>2</title>
</path>
</g>
</svg>
第二条路径正确显示,但第一条路径“不可见”。
例如,当我将第一条路径的笔划更改为red
时,该路径就会正确显示。
那么:为什么我的第一个路径没有显示线性渐变?我做错了什么?