如何同步几个高图上的更新

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); 
}