如何使用带有 json 数据的角度图表？答案

【问题标题】：How to use angular-charts with json data?如何使用带有 json 数据的角度图表？
【发布时间】：2015-12-23 21:07:07
【问题描述】：

我试图用angular-charts 可视化一些数据，但我不知道我做错了什么。我是 angularjs 的初学者。

数据应该这样传递：

  $scope.labels = ["January", "February", "March", "April", "May", "June", "July"];
  $scope.series = ['Series A', 'Series B'];
  $scope.data = [
    [65, 59, 80, 81, 56, 55, 40],
    [28, 48, 40, 19, 86, 27, 90]
  ];

我正在使用 $http 从 API 获取它，所以我有这样的东西：

app.controller("LineCtrl", function($scope, $http) {
    $http({
        method: 'GET',
        url: '/meteo_dane'
    }).then(function successCallback(response) {
        $scope.dane = response.data;
        $scope.labels = [$scope.dane.updated_at];
        $scope.series = ['Series A'];
        $scope.data = [
            [$scope.dane.temp],
        ];
        console.log(this.dane);
    }, function errorCallback(response) {
        //
    });

但它现在正在工作 - 图表是空的。我要使用的数据格式如下：

[
  {
    "_id": "567aa394d452128c6d595f0e",
    "windspeedmph": 0,
    "winddir": 135,
    "humidity": 30.5,
    "temp": 24,
    "updated_at": "2015-12-23T13:37:24.881Z",
    "__v": 0
  },
  {
    "_id": "567aa39ed452128c6d595f0f",
    "windspeedmph": 0,
    "winddir": 135,
    "humidity": 30.4,
    "temp": 24.1,
    "updated_at": "2015-12-23T13:37:34.836Z",
    "__v": 0
  },
]

我要及时显示温度。稍后我想展示我拥有的其余数据。

我应该怎么写？

【问题讨论】：

标签： javascript angularjs json charts

【解决方案1】：

我觉得你$scope.data的赋值格式不对，应该是多维数组。

您应该创建$scope.temp 的数组，其中每个dane 都有temp

$scope.temp = [] 
angular.forEach($scope.dane, function(value){
   $scope.temp.push(value.temp)
});
$scope.data = $scope.temp //removed [] because its already an array.

Example Plunkr

【讨论】：

你是不是这个意思：$scope.dane = response.data; $scope.temp = []; $scope.updated_at = []; angular.forEach($scope.dane, function(value){ $scope.temp.push(value.temp); $scope.updated_at.push(value.updated_at); }); $scope.labels = $scope.dane.updated_at; $scope.series = ['Series A']; $scope.data = $scope.updated_at;
@wiwo 看看我添加的示例 plunkr。
就是这样！感谢您的帮助！
@wiwo 很高兴为您提供帮助..谢谢 :)
我看到你对 AngularJS 和 Chart.js 了解很多。我确实使用了你对其他问题的一些回答。请你看看这个：stackoverflow.com/questions/34516923/…