SVG:为什么在使用linearGradient时无法显示我的路径

时间:2018-08-29 15:39:39

标签: svg

我有一个简单的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时,该路径就会正确显示。

那么:为什么我的第一个路径没有显示线性渐变?我做错了什么?

0 个答案:

没有答案