javascript - 如何在我的信息中使用 Angular 图表？

我正在尝试使用Angular Charts，实际上是这些文档中的第二张图表。

他们输入的信息是这个

    $scope.labels = ['2006', '2007', '2008', '2009', '2010', '2011', '2012'];

    $scope.series = ['Series A', 'Series B'];

    $scope.data = [
      [65, 59, 80, 81, 56, 55, 40],
      [28, 48, 40, 19, 86, 27, 90]
    ];

而您在视图中调用它的方式是

          <canvas id="bar" class="chart chart-bar"
            chart-data="data" chart-labels="labels" chart-series="series">
          </canvas>

为了得到这个结果



我需要的是使我收到的信息适应该图表，这是我收到的信息

 {
   "12-15-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "12-16-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "12-17-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":1,
         "amount":22
      }
   },
   "12-18-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "12-19-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "12-20-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "12-21-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":1,
         "amount":22
      }
   },
   "12-22-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":1,
         "amount":150
      }
   },
   "12-26-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "12-28-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "12-29-2015":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "01-03-2016":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "01-04-2016":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "01-05-2016":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "01-06-2016":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "01-10-2016":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "01-11-2016":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   },
   "01-14-2016":{
      "55f6de98f0a50c25f7be4db0":{
         "total":0,
         "amount":0
      }
   }
 }

该数组中的每个键都是一天，每个键代表一个traffic_source，每个traffic_source都有一个对象，该对象总共包含一个数量。

我注意到的一件事是，他们使用数组来做，而我有一个对象。

你推荐我做什么？
更新

这是我到目前为止所拥有的：

      $scope.clicksChartDate = [];
      $scope.clicksChartBars = [];


      angular.forEach($scope.clicksConversionData, function(value, key) {
        angular.forEach(value, function(value, key) {
          // $scope.clicksChartBars.push(item.total);
          console.log('value', value);
          console.log('key', key);
        })
        $scope.clicksChartDate.push(key);

      });

数组$scope.clicksChartDate是我存储年/日期的地方，这表示可以，我遇到的问题是第二个.forEach中的值返回了一些与此类似的对象：{total: 0, amount: 0}，我怎么能值并放入数组？

最佳答案

假设您的traffic_source永不更改，您可以通过以下方式获得预期的格式：

$scope.clicksChartDate = Object.keys($scope.clicksConversionData);

$scope.clicksChartSeries = ["total", "amount"];

var data = $scope.clicksChartSeries.map(function(series) {
  return $scope.clicksChartDate.map(function(label) {
    return $scope.clicksConversionData[label]["55f6de98f0a50c25f7be4db0"][series];
  });
});

如果确实发生变化，而您只关心第一个，请更换：

return $scope.clicksConversionData[label]["55f6de98f0a50c25f7be4db0"][serie];

有了这个：

var trafficSource = Object.keys($scope.clicksConversionData[label])[0];
return $scope.clicksConversionData[label][trafficSource][serie];