如何實時推送數據點AmCharts

Question

我正在研究AngularJS應用程序中的實時AmCharts，我想知道如何將數據點推入圖表。以下是我的控制器中的代碼：

$http.get(hostNameService.getHostName()+"/dashboard/itemValue") 
      .then(function (response) {$scope.item = response.data.items; 
       function generateChartData(){ 
        var chartData = []; 
        for (var i = 0; i < $scope.item.length; i++) { 
         var itemId = $scope.item[i].itemId; 
         var avail = $scope.item[i].itemAvailability; 

         chartData.push({ 
          "itemId": itemId, 
          "avail": avail 
         }); 
        } 

        return chartData; 
       } 

       /** 
       * Create the chart 
       */ 
       var chart = AmCharts.makeChart("toolAvailability", { 
        "type": "serial", 
        "theme": "light", 
        "zoomOutButton": { 
         "backgroundColor": '#000000', 
         "backgroundAlpha": 0.15 
        }, 
        "dataProvider": generateChartData(), 
        "categoryField": "itemId", 
        "graphs": [ { 
         "id": "g1", 
         "valueField": "avail", 
         "bullet": "round", 
         "bulletBorderColor": "#FFFFFF", 
         "bulletBorderThickness": 2, 
         "lineThickness": 2, 
         "lineColor": "#b5030d", 
         "negativeLineColor": "#0352b5", 
         "hideBulletsCount": 50 
        } ], 
        "chartCursor": { 
         "cursorPosition": "mouse" 
        } 
       }) 

       /** 
       * Set interval to push new data points periodically 
       */ 
       // set up the chart to update every second 
       setInterval(function() { 
        // normally you would load new datapoints here, 
        // but we will just generate some random values 
        // and remove the value from the beginning so that 
        // we get nice sliding graph feeling 

        // remove datapoint from the beginning 
        chart.dataProvider.shift(); 

        // for (var i = 0; i < $scope.item.length; i++) { 
        //  var itemId = $scope.item[i].itemId; 
        //  var avail = $scope.item[i].itemAvailability; 
        // } 


        chart.dataProvider.push({// not sure how I can push the json data here 
         date: //need to push the value here, 
         visits: //need to push the value here 
        }); 
        chart.validateData(); 
       }, 1000); 
      }); 

我的圖表正在從Web服務獲取數據。 Web服務返回10個項目，每個項目的可用性應實時更新。我在圖表中使用itemId和可用性。最初我能夠在圖表中加載數據。但是當圖表轉移一個值時，我應該如何推動新的價值。任何人都可以讓我知道如何實現這一功能。

Answer 1

我能夠通過在我的代碼中進行以下更改來實現此目的。我添加了下面的函數，並在設置超時函數中調用了這個函數。因此，對於圖表中的每個轉變，一個值將被推入圖表。

function pushNewData(index){ 
         var itemId = $scope.tools[index].itemId; 
         var avail = $scope.tools[index].availability; 

         chart.dataProvider.push({ 
          itemId: itemId, 
          avail: avail 
         }); 

        } 

       var i =0; 
       setInterval(function() { 
        chart.dataProvider.shift(); 
        pushNewData(i); 
        if(i < $scope.items.length - 1){ 
         i++; 
        }else{ 
         i = 0; 
        } 


        chart.validateData(); 
       }, 1000);