Angular 6制图Google Sheets API数据

时间:2018-07-03 06:17:10

标签: angular google-api chart.js

我正在尝试使用Angular 6和Chartjs绘制一些数据。

数据源来自Google Sheet API获取请求。

Google Sheet

我无法正确理解的部分在下面的component.ts中。

ngOnInit() {
  this.weather.dailyForecast()
    .subscribe(res => {

      let temp_high = res['valueRanges'].map(res => res.values);
      let temp_low = res['valueRanges'].map(res => res.values);
      let day = res['valueRanges'].map(res => res.values);

API的JSON如下所示:

{
"spreadsheetId": "1QOPhxNMaYtPQA8cKw3XDrHBbzMGXjRXOmuknH8VRmgQ",
"valueRanges": [
{
"range": "Sheet1!A1:A5",
"majorDimension": "COLUMNS",
"values": [
[
"Day",
"HighTemp",
"LowTemp"
]
]
},
{
"range": "Sheet1!B1:B5",
"majorDimension": "COLUMNS",
"values": [
[
"1",
"10",
"9"
]
]
},
{
"range": "Sheet1!C1:C5",
"majorDimension": "COLUMNS",
"values": [
[
"2",
"15",
"12"
]
]
},
{
"range": "Sheet1!D1:D5",
"majorDimension": "COLUMNS",
"values": [
[
"3",
"10",
"9"
]
]
},
{
"range": "Sheet1!E1:E5",
"majorDimension": "COLUMNS",
"values": [
[
"4",
"11",
"10"
]
]
}
]
}

当API数据由对象构成时,我可以使用它,但是Google表格显示数据的方式意味着每个单元格都是数组的一部分,因此我不知道如何正确地引用数据。

任何帮助将不胜感激!

1 个答案:

答案 0 :(得分:0)

已解决。

ngOnInit() {
  this.weather.dailyForecast()
    .subscribe(res => {

      var data = res.feed

      let temp_high = data['entry'].map(data => data.title.$t);
      let temp_low = data['entry'].map(data => data.content.$t);