Highcharts - redraw()与新的Highcharts.chart

Question

我很难理解更新highcharts图表的正确方法.假设我已经渲染了一个图表,然后我想以某种方式更新它.例如,我可能想要更改数据系列的值,或者我可能想要启用dataLabels.

目前我唯一可以弄清楚如何做到这一点的方法是改变图表选项,并new Highcharts.chart用来告诉highcharts重绘.

但是,我想知道这是否有点矫枉过正,而且可能有可能"原位"改变图表,而不必从头开始new Highcharts.chart.我注意到有一种redraw()方法,但我似乎无法让它工作.

很感谢任何形式的帮助.

谢谢,

知更鸟

示例代码如下,底部有一个jsFiddle

$(document).ready(function() {

chartOptions = {
    chart: {
        renderTo: 'container',
        type: 'area',
    },
    series: [{
        data: [1,2,3]
    }]
};

chart1 = new Highcharts.Chart(chartOptions);


chartOptions.series[0].data= [10,5,2];
chart1 = new Highcharts.Chart(chartOptions);

//The following seems to have no effect
chart1.series[0].data = [2,4,4];
chart1.redraw();

});?

http://jsfiddle.net/sUXsu/18/

[编辑]:

对于此问题的任何未来观众,值得注意的是没有隐藏和显示dataLabels的方法.以下显示了如何执行此操作:http://jsfiddle.net/supertrue/tCF8Y/

Answer 1

chart.series[0].setData(data,true);

该setData方法本身将调用重绘方法

Answer 2

在调用重绘之前,你必须在图表对象上调用set和add函数.

chart.xAxis[0].setCategories([2,4,5,6,7], false);

chart.addSeries({
    name: "acx",
    data: [4,5,6,7,8]
}, false);

chart.redraw();

Answer 3

var newData = [1,2,3,4,5,6,7];
var chart = $('#chartjs').highcharts();
chart.series[0].setData(newData, true);

说明:
变量newData包含要在图表中更新的值.变量chart是图表的对象.setData是由highchart提供的更新数据的方法.

方法setData包含两个参数,在第一个参数中我们需要将新值作为数组传递,第二个参数是布尔值.如果true然后图表更新自己,如果false那时我们必须使用redraw()方法来更新图表(即chart.redraw();)

http://jsfiddle.net/NxEnH/8/