2016-08-12 97 views
1

我试图通过将其现有数据集替换为从url请求中提取的数据集(这将在不同时间使用不同的数据)来每分钟更新一次我的Highstock图表。每分钟更换一次数据集

到目前为止,我甚至无法根据手动更改来刷新数据。

工作至今:https://jsfiddle.net/Lz8gLw8j/

我试图测试变化的数据,然后用它的更新:

varData = [[0,0],[1,2]] 
$('#chart2').highcharts().redraw(); 

这什么都不做。

回答

1

您可以设置新的数据,以下方式highchart:

 var newData = [ 
     [1251763200000, 23.61], 
     [1251849600000, 23.60], 
     [1251936000000, 23.79] 
    ] 

    var chart = $('#chart2').highcharts(); 
    chart.series[0].setData(newData); 

    $('#chart2').highcharts().redraw(); 

更新小提琴手:

https://jsfiddle.net/Lz8gLw8j/5/

0

看起来有,你可以使用

加载事件
chart : { 
    events : { 
     load : function() { 

      // set up the updating of the chart each second 
      var series = this.series[0]; 
      setInterval(function() { 
       var x = (new Date()).getTime(), // current time 
       y = Math.round(Math.random() * 100); 
       series.addPoint([x, y], true, true); 
      }, 1000); 
     } 
    } 
} 

这是小提琴:https://jsfiddle.net/jjwilly16/Lz8gLw8j/6/

FYI:我把这个从一个实例关闭Highcharts网站:http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/stock/demo/dynamic-update/

0

您可以将数据通过addPoint方法使用setData方法添加到现有系列和更换数据集。这两种方法的第二个选项参数允许您重绘图表。数据应该是数组的数组。嵌套数组包含绘制的实际数据。内部嵌套数组的第一个元素是epoch(x),而第二个元素是实际值(y)。该时代是自1970年1月1日午夜GMT/UTC以来的秒数。我已经更新了小提琴,让您可以添加数据点以及重置数据。

主要的变化是这些行:

$('#updateButton').click(function() { 
    var date = $('#newDate').val(); 
    var epoch = Math.round(new Date(date).getTime()); 
    var value = parseInt($('#newValue').val()); 
    var chart = $('#chart2').highcharts(); 
    chart.series[0].addPoint([epoch, value], true); 
}); 
$('#resetChart').click(function() { 
    var chart = $('#chart2').highcharts(); 
    chart.series[0].setData(null, true); 
}); 

https://jsfiddle.net/Lz8gLw8j/7/