我打算在我的網頁上有一個按鈕,以便點擊一個按鈕後,一個點將被添加到圖表而不會重新繪製整個圖表(圖表是這個http://www.highcharts.com/demo/dynamic-update的修改版本)。但是,我目前的代碼不起作用。Highchart:如何通過點擊按鈕來更新動態圖表?
這裏是關注代碼:http://jsfiddle.net/wtvaz9gc/7/
var series;
$(function drawCharts(numberOfPoint) {
// if(typeof chartData == undefined){
// chartData = $(dataStore.getXml());
// }
$("#b").click(function(){
series.addPoint([3,3]);
})
$(document).ready(function() {
Highcharts.setOptions({
global: {
useUTC: false
}
});
$('#container').highcharts({
chart: {
type: 'line',
animation: Highcharts.svg, // don't animate in old IE
marginRight: 10,
events: {
load: function() {
series = this.series[0];
// window.myGlobal1 = this.series[0].data[this.series[0].data.length - 1].y;
// console.log(window.myGlobal1 + " " + this.series[0].data[this.series[0].data.length - 1].y);
},
}
},
title: {
text: ''
},
xAxis: {
title: {
text: 'Jahre'
},
// gridLineWidth: 0,
// lineWidth:1,
startOnTick: true,
tickPixelInterval: 40,
min: 0,
max: 10,
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
yAxis: {
title: {
text: 'Vermögen(in EUR)'
},
labels: {
enabled: true
},
min: 0,
max: 100,
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
enabled : false,
formatter: function() {
return '<b>' + this.series.name + '</b><br/>' +
Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
Highcharts.numberFormat(this.y, 2);
}
},
legend: {
enabled: false
},
exporting: {
enabled: false
},
series: [{
name: 'Random data',
data: ($(function() {
// generate an array of random data
var data = [],
time = (new Date()).getTime(),
i, preValue;
for (i = 0; i < numberOfPoint; i += 1) {
if(i == 0){
data.push({
x: i,
y: 10
});
} else {
data.push({
x: i,
y: chartData["wealth"][0][i]
});
}
}
// showMsg(data);
// console.log(data);
return data;
}()))
}]
});
});
});
當我試圖在Chrome運行它,我得到了以下錯誤報告: highcharts.js:遺漏的類型錯誤:i.splice不是一個函數 addPoint @ highcharts.js:...
在這種情況下,我應該如何使用函數「addPoint」? 還是應該用其他方法達到目的?
檢查您的控制檯有一些錯誤:的ReferenceError:未定義chartData –
對不起,我會解決這個問題。 – Aqqqq
告訴我們,當你這樣做。 – vaso123