我正在尝试使用具有单个类别但4个值的列图。该图的初始渲染工作正常。但是,当我使用系列[0] .setData((方法更新数据时,它会创建4个类别而不是更新单个类别。
这是JSFIDDLE链接
$(function() {
var chart;
$(document).ready(function() {
chart = Highcharts.chart('container', {
chart: {
type: 'column'
},
title: {
text: 'Packet Summary Stats'
},
subtitle: {
text: 'Source: ABC'
},
xAxis: {
categories: [
'Packet Summary'
],
crosshair: true
},
yAxis: {
min: 0,
title: {
text: 'Packet Count'
}
},
tooltip: {
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' + '<td style="padding:0"><b>{point.y}</b></td></tr>',
footerFormat: '</table>',
shared: true,
useHTML: true
},
plotOptions: {
column: {
pointPadding: 0.2,
borderWidth: 1
}
},
series: [{
"data": [100],
"name": "Rx"
}, {
"data": [90],
"name": "Tx"
}, {
"data": [10],
"name": "Dropped"
}, {
"data": [10],
"name": "No Match"
}]
});
});
$('#button').click(function() {
chart.series[0].setData([
[200],
[180],
[20],
[20]
]);
});
});
我无法弄清楚我在这里做错了什么。任何帮助都将不胜感激。
谢谢
您必须更新图表为
小提琴
$('#button').click(function() {
chart.series[0].setData(
[200]
);
chart.series[1].setData(
[180]
);
chart.series[2].setData(
[20]
);
chart.series[3].setData(
[20]
);
});