javascript - HighCharts-ng 的 Angular JS 中的 setInterval 不起作用

Question

如何在 angularjs highcharts ng 折线图配置设置中设置 setInterval。我正在使用 highcharts-ng 创建动态折线图，我的图表显示初始静态数据，在显示动态数据时，我看到 scope.chartConfig4 中的加载事件没有引起注意，因此我的图表保持静态。这是我的代码片段。

更新:我正在使用 highcharts-ng 一个 Angular Directive(指令)，即使在我将超时时间更正为间隔后，它也不会显示我的动态 map 。我正在尝试转换以下代码 http://www.tutorialspoint.com/highcharts/highcharts_dynamic_spline.htm使用 angularjs 。请帮忙。

 $scope.chartConfig4 = {
   chart: {
     type: 'spline',
     animation: Highcharts.svg, // don't animate in old IE
     marginRight: 10,
     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.random();
           series.addPoint([x, y], true, true);
         }, 1000);
       }
     }
   },
   title: {
     text: ''
   },
   xAxis: {
     type: 'datetime',
     tickPixelInterval: 150
   },
   yAxis: {
     title: {
       text: 'Users(in thousands)'
     },
     plotLines: [{
       value: 0,
       width: 1,
       color: '#808080'
     }]
   },
   tooltip: {
     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: 'Users',
     data: (function() {
       // generate an array of random data
       var data = [],
         time = (new Date()).getTime(),
         i;

       for (i = -19; i <= 0; i += 1) {
         data.push({
           x: time + i * 1000,
           y: Math.random()
         });
       }
       return data;
     }())
   }]
 };

更新: 我正在使用 highcharts-ng 一个 Angular Directive(指令)，即使在我将超时时间更正为间隔后，它也不会显示我的动态 map 。我正在尝试转换以下代码 http://www.tutorialspoint.com/highcharts/highcharts_dynamic_spline.htm使用 angularjs 。请帮助。

Answer 1

setInterval 将您带出 Angular 的范围，这意味着永远不会调用 $scope.apply()。你应该使用 $interval相反，以便正确触发摘要循环。

$interval(function() {
    var x = (new Date()).getTime(), // current time
    y = Math.random();
    series.addPoint([x, y], true, true);
}, 1000);