如何同步幾個高圖上的更新

Question

我有一個頁面有幾個動態生成的高圖，當前每個更新每分鐘基於圖表創建時間。我的一個行動項目是將更新同步到一個全局更新時鐘，但我似乎無法更新圖表，除非我在內部完成。目前，我不喜歡這樣寫道：

var chart = new Highcharts.chart({ 
    chart: { 
     // blah blah blah chart stuff 
    }  
}, function(chart){ 
    setInterval(function(){ 
     // get the data and update this chart 
     chart.series[0].update({ 
      data: newSeries[0].data, 
      pointStart: newSeries[0].pointStart 
     }, false); 
     chart.redraw(); 
    },60000); 
}); 

頁面可以有多種，它們中的由用戶創建的選擇選項，並從JSON格式的服務器請求數據任意給定時間。

如何配置它，以便我可以從全局setInterval函數中單獨定位每個圖表？

UPDATE

結合一些回答其他問題後，我發現我設法這樣做是爲了解決我的問題：

HTML

<div id="chart_54862" class="chartContainer"></div> 

的JavaScript

genChart(getChartData(), 'chart_54862'); 
function genChart(data, location){ 
    var container = $('#'+location); 
    $(container).highcharts({ 
     // fun chart stuff 
    }); 
} 

現在，當我想更新圖表我只是發：

// Global setInterval 
setInterval(function(){ 
    $('.chartContainer').each(function(){ 
     // get the updated json = newSeries[] 
     var container = '#'+this.id; 
     var chart = $(container).highcharts(); 
     chart.series[0].update({ 
      data: newSeries[0].data, 
      pointStart: newSeries[0].pointStart 
     }, false); 
     chart.redraw(); 
    }, 60*1000); 
}); 

Answer 1

您可以添加全局計數器，這將增加，如果所有的圖表都呈現進行檢查。然後只添加一個setInterval（），並且您可以使用Highcharts.charts[index]訪問所有圖表。

var limiter = 0; 

var chart = new Highcharts.chart({ 
    chart: { 
     // blah blah blah chart stuff 
    }  
}, function(chart){ 
    limiter++; 
    if(limiter == 10) { 
     addInterval() 
    } 
}); 

function addInterval() { 
    setInterval(function(){ 
     // get the data and update this chart 
     Highcharts.charts[4].series[0].update({ 
      data: newSeries[0].data, 
      pointStart: newSeries[0].pointStart 
     }, false); 
     chart.redraw(); 
    },60000); 
}