highcharts - 高图上具有负值的 nGradient 效果

Question

我有以下渐变效果折线图。

https://jsfiddle.net/e7Ly41wm/2/

plotOptions: {
                area: {
                    fillColor: {
                        linearGradient: {
                            x1: 0,
                            y1: 0,
                            x2: 0,
                            y2: 1
                        },
                        stops: [
                            [0, Highcharts.getOptions().colors[0]],
                            [1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                        ]
                    },
                    marker: {
                        radius: 2
                    },
                    lineWidth: 1,
                    states: {
                        hover: {
                            lineWidth: 1
                        }
                    },
                    threshold: null
                }
            }

对于正值，我想在 0 处停止渐变效果。

对于负值，我希望对 0（反向）产生渐变效果并在 0 处停止。

它将类似于但具有渐变效果。

如果需要，我可以将图表类型更改为面积图。

我需要做哪些改变才能实现这一目标？

Answer 1

这是您想要实现的输出吗？

我所做的只是将系列类型更改为areaspline.

演示：https ://jsfiddle.net/BlackLabel/7t6x4uzg/

---

编辑

您可以使用区域为特定范围定义填充颜色。

演示：https ://jsfiddle.net/BlackLabel/kx209nzh/

API：https ://api.highcharts.com/highcharts/series.line.zones.fillColor