如何通过线性渐变将y轴的笔触颜色更改为

问题描述

我正在尝试将我的y轴笔触颜色更改为在图表中呈线性渐变。 我知道，我可以在defs元素中定义，并在内部定义linerGradient元素中定义。 但是当我将笔划设置为stroke: "url(#linear)"时，y轴笔划消失了。 在折线图中对我有用，但在y轴上无效

           

            <defs>
                    <linearGradient
                        id="linear"
                        x1="84"
                        y1="5"
                        x2="84.1"
                        y2="470"
                    >
                        <stop offset="0%" stopColor="#05a" />
                        <stop offset="100%" stopColor="#0a5" />
                    </linearGradient>
                </defs>
                <YAxis
                    tickMargin={8}
                    tickLine={false}
                    label={{
                        value: props.yAxisLabel,position: "insideBottomLeft",angle: -90,offset: 0,fill: "#A5A5A5",}}
                    tick={{ fill: "#A5A5A5" }}
                    ticks={[60,120]} //Todo: change to function
                    strokeWidth={10}
                    // stroke="#FF3C06"
                    stroke="url(#linear)"
                    style={{
                        strokeLinecap: "round",}}
                />

有什么帮助吗？

解决方法

我刚刚通过添加fill="url(#linear)"而不是stroke="url(#linear)"

解决了这个问题