Highcharts动态添加/更改y轴plotLines

Question

我希望让用户能够在图表上添加最大的"plotLine"并且当数据超过该线时，更改图表的背景颜色。但是，我无法找到一种更新"plotLines"的方法。我已经尝试了：

chart.yAxis[0].update({
    plotLines: [{
        id: 'limit-max',
        color: 'blue',
        dashStyle: 'LongDashDot',
        width: 1,
        value: 45000,
        zIndex: 0
    }]
});

但我收到了错误信息： ...dBands，function（a）{a.render（）}）;n（this.series，function（a）{a.isDirty =！0}）}，setCat ...

- jbolanos

---

由于我找不到我使用的代码，我将只留下一条注释。尝试删除plotLine，然后使用新值重新添加它。 - wergeld

成功了 - 我一开始没有创建一个，然后使用更新添加了它。 - jbolanos

Answer 1

您只能销毁并创建新的plotLins，因为update()函数不可用。

- Sebastian Bochan

---

我从源代码中剥离了plotLines，并允许用户在图表创建后添加它。 - jbolanos

您可以使用 addPlotLine 函数来实现此操作。http://api.highcharts.com/highcharts#Axis.addPlotLine() - Sebastian Bochan

@SebastianBochan - 这个函数被移除了吗？在文档或Google上找不到它... - B Seven

Answer 2

只需添加此代码，然后您就可以使用plotline.update方法。

    //Add support for update method
    Highcharts.PlotLineOrBand.prototype.update = function (newOptions){
        var plotBand = this;
        Highcharts.extend(plotBand.options, newOptions);
        if (plotBand.svgElem) {
            plotBand.svgElem.destroy();
            plotBand.svgElem = undefined;
            plotBand.render();
        }
    }

- Akram Kamal Qassas

---

谢谢，这个很好用。只需传递您需要更新的属性即可：chart.series[0].xAxis.plotLinesAndBands[0].update({ "color": "#eeeeee" }); - Mark

Answer 3

以下是对我有效的方法 http://jsfiddle.net/tx1kt0bj/2/

var plotBand = tempAxis.plotLinesAndBands[0];

$.extend(plotBand.options, {
    color: '#000',
    to: 10,
    from: 2
});
plotBand.svgElem.destroy();
plotBand.svgElem = undefined;
plotBand.render();

- Thomas Vo

Answer 4

我尝试给plotLine分配一个id，

首先通过removePlotLine(id)完全删除plotline，然后通过addPlotLine将其重新添加。这对我非常有效。

function upgradePlotLine(new_line) {
    chart.yAxis[0].removePlotLine('my_line');
    chart.yAxis[0].addPlotLine(new_line);
}

- Yifei