highcharts-ng addpoint each second

Question

I has a livedata spline (updated each second) But i ll do the same thing with an angular app

(I want to do this : http://www.highcharts.com/demo/dynamic-update with highcharts-ng in my angularApp.)

without angular i has :

events: {
                load: function () {

                    var series = this.series[0];
                    setInterval(function () {
                        var x = (new Date()).getTime(), // now
                            y = Math.random()*180;
                        series.addPoint([x, y], true, true);
                    }, 1000);
                }
            }

But with angular i try to code with $scope to do this... this do nothing :/

 var series = $scope.series[0];
 setInterval(function () {
        var x = (new Date()).getTime() // now
      var y = Math.random();
        series.addPoint([x, y], true, true);
    }, 1000); 
};

here a fiddle : http://jsfiddle.net/c58b1z6b/10/

Thanks for help

Answer 1

I think you will be able to achieve the desired results with a small change adding $scope.$apply in your setInterval function:

     setInterval(function () {
        var x = (new Date()).getTime() // now
        var y = Math.random()*180;
        $scope.$apply(function() {
           //series.addPoint([x, y], true, true);
           series.data.push(y);
        })
    }, 1000); 

I have commented out the original call to addPoint() as the results were not quite what I expected...