0
我正在嘗試使用以下代碼每3秒向highcharts線圖添加一個新點。但它並沒有增加新的觀點。 我證實了從json回來的點是正確的,如[x,y]。 沒有getjson部分並使用像[3,4]這樣的點就可以工作。但是當我添加json時,它不會添加應該傳遞給json的新數據。highcharts動態添加點
var chart; // global
function requestData() {
var series = this.series[0];
$.getJSON('url',
function(point){
// add the point
series.addPoint(point);
// call it again after one second
setInterval(requestData, 3000);
});
}
我加載requestData的方式如下,它可以用一個靜態點添加。
chart: {
zoomType: 'x',
events: {
load: requestData
}
任何想法爲什麼函數不重複或沒有獲取數據或不把他的數據放在點或添加點不起作用?
我用點擊代替加載,它工作正常。似乎週期性加載不起作用。
編輯:全圖的代碼:
.getJSON('url2',
function(data){
$('#container11').highcharts({
chart: {
zoomType: 'x',
events: {
load: requestData
}
},
title: {
text: ''
},
subtitle: {
text: document.ontouchstart === undefined ?
'Click and drag in the plot area to zoom in' : 'Pinch the chart to zoom in'
},
xAxis: {
type: 'time',
dateTimeLabelFormats: {
hour: '%H:%M',
}
},
yAxis: {
title: {
text: 'test'
}
},
legend: {
enabled: false
},
plotOptions: {
area: {
fillColor: {
linearGradient: {
x1: 0,
y1: 0,
x2: 0,
y2: 1
},
stops: [
[0, Highcharts.getOptions().colors[0]],
[1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
]
},
marker: {
radius: 2
},
lineWidth: 1,
states: {
hover: {
lineWidth: 1
}
},
threshold: null
}
},
series: [{
type: 'area',
name: 'name',
data: data
}]
});
});
函數'requestData'負責爲圖表添加點,但是您正在設置'ajaxRequest'的間隔。 'setInterval(ajaxRequest,3000); '應該是'setTimeout(requestData,3000); '。如果沒有,那麼發佈完整的代碼將有所幫助'requestData'如何在它內部獲得'this'上下文?這個函數是一個對象的一部分嗎? – Ejaz
非常感謝你,在我的代碼中它是'requestData',我只是做了一個複製錯誤。我編輯了代碼。實際上,我嘗試使用'series = chart.series [0]'而不是'var series = this.series [0];',它甚至沒有傳遞一個靜態添加點。我假設這個函數是從圖表加載的,這就是爲什麼'this'起作用的原因。完整代碼是指圖表代碼的其餘部分?我在主要問題中添加了其餘代碼 – Hans
你見過Highcharts文檔嗎?在文檔中,您可以找到有關如何動態添加點的信息:http://www.highcharts.com/docs/working-with-data/live-data –