Highcharts – 重绘()与新的Highcharts.chart
我正在努力了解更新高图表的正确方法。 假设我已经提交了一个图表,然后我想以某种方式更新它。 例如,我可能想要更改数据系列的值,或者我可能想要启用dataLabels。
目前唯一可以弄清楚如何做的方法是改变图表选项,并使用new Highcharts.chart
来告诉highchart重绘。
不过,我想知道这是否可能是矫枉过正的,也许可以在原位更改图表,而无需new Highcharts.chart
。 我注意到有一个redraw()
方法,但我似乎无法得到它的工作。
很感谢任何forms的帮助。
谢谢,
知更鸟
示例代码如下,在底部有一个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/
chart.series[0].setData(data,true);
setData
方法本身将调用重绘方法
在调用重绘之前,您必须调用set和在图表对象上添加函数。
chart.xAxis[0].setCategories([2,4,5,6,7], false); chart.addSeries({ name: "acx", data: [4,5,6,7,8] }, false); chart.redraw();
var newData = [1,2,3,4,5,6,7]; var chart = $('#chartjs').highcharts(); chart.series[0].setData(newData, true);
说明:
variablesnewData
包含要在图表中更新的值。 variableschart
是chart
的一个对象。 setData
是由高图提供的用于更新数据的方法。
方法setData包含两个参数,在第一个参数中,我们需要传递新值作为数组,第二个参数是布尔值。 如果为true
则图表自动更新,如果为false
则必须使用redraw()
方法更新图表(即chart.redraw();
)