Angular/JS - Google區域圖表中的動態內容

我使用Google Charts Area Chart來顯示圖表中的溫度和日期。我需要顯示的內容是動態的，應該在加載時填寫。我使用角與Sails.js ，每個溫度被存儲在對象batchTemps，並且對象被存儲在對象batchTempList其具有陣列; 內容。Angular/JS - Google區域圖表中的動態內容

我需要使用batchTempList.contents填充區域圖表，但不能找出一個工作方式。

下面是一個例子靜態數據生成圖表：

data = google.visualization.arrayToDataTable([ 
     ['Time', 'Temp C°'], 
     ['2017-05-31 13:44:54', 20.5], 
     ['2017-05-31 13:54:54', 21.7], 
     ['2017-05-31 14:04:54', 22.0], 
     ['2017-05-31 14:14:54', 21.3] 
    ]);

我想要從列表中的數據，並輸入像上面的靜態示例。 batchTemps對象具有ID，溫度和createdAt（記錄日期）。

我試過，但沒有成功的例子：

data = google.visualization.arrayToDataTable([ 
     ['Time', 'Temp C°'], 
     for (batchTemp in batchTempList.contents) { 
        ['batchTemp.createdAt', batchTemp.temperature], 
       } 
]);

的jsfiddle靜態的解決方案：http://jsfiddle.net/qphnyash/

PS：在以前的版本我的申請，我用Sails.js與EJS，並用下面的代碼，它的工作：

var data = google.visualization.arrayToDataTable([ 
    ['Time', 'Temp C°'], 
    <% _.each(brewery.temperatures, function(breweryTemp) { %> 
    ['<%= breweryTemp.createdAt %>', <%= breweryTemp.temperature %>], 
    <% }); %> 
    ]);

但因爲我切換到角，而目前使用的模板，而不是.ejs文件，我無法使用它。

在此先感謝，任何幫助將不勝感激。

來源

2017-06-01 Morten Amundsen

請注意，角度和AngularJS是不一樣的。 AngularJS是指版本1.x，而Angular是指版本2+。你確切指的是哪個版本？ – borislemke

@borislemke謝謝，沒有注意到這個標籤。我正在使用Angular 1.3！ –

嘗試建立該陣列之前，建立數據表...

EDIT

構建圖表數據陣列...

如果batchTempList.contents是一個數組[]，而不是物體{}，

你想要使用forEach ...

batchTempList.contents.forEach(function (batchTemp) { 
    chartData.push(
    [batchTemp.createdAt, batchTemp.temperature] 
); 
});

或定期for環......

for (var i = 0; i < batchTempList.contents.length; i++) { 
    chartData.push(
    [batchTempList.contents[i].createdAt, batchTempList.contents[i].temperature] 
); 
}

來源

2017-06-01 13:25:24 WhiteHat

謝謝！我會檢查出來，回來！ :) –

工程就像一個魅力！根據你的編輯，我選擇了for each方式。 –

只是可以肯定的，你介意看看這個JSFiddle嗎？ https：// jsfiddle。net/85rb83eL/ –

Angular/JS - Google區域圖表中的動態內容

回答

相關問題