要在Highcharts系列中使用的格式数据

时间:2015-06-02 14:05:29

标签: javascript json angularjs highcharts

您好我正在尝试使用Highcharts制作堆积条形图,但数据必须格式化为一个系列消费的方式让我感到沮丧。

    series: [{
        name: 'John',
        data: [5]
    }, {
        name: 'ee',
        data: [2]
    }, {
        name: 'aa',
        data: [7]
    },{
        name: 'zz',
        data: [4]
    },{
        name: 'Joe',
        data: [3]
    }]

这就是其中一个示例在其网站上的堆叠条形图的方式。我使用$http.get()最初从Web服务获取数据,采用JSON格式,如下所示:

{
  "id": 13,
  "name": "JohnSnow",
  "totalScore": 5.239947894580996,
  "models": [
    {
      "id": 0,
      "name": "Grey",
      "score": 75.5
    },
    {
      "id": 1,
      "name": "Black",
      "score": 1.2355425046127677
    },
    {
      "id": 2,
      "name": "Purple",
      "score": 24.0705126173457
    },
    {
      "id": 3,
      "name": "Teal",
      "score": 28.981312850901684
    },
    {
      "id": 4,
      "name": "Yellow",
      "score": 31.373482114014525
    },
    {
      "id": 5,
      "name": "Green",
      "score": 22.02040979235661
    },
    {
      "id": 6,
      "name": "Red",
      "score": 11.137161646416322
    },
    {
      "id": 7,
      "name": "Blue",
      "score": 25.83014182677578
    },
    {
      "id": 8,
      "name": "Orange",
      "score": 4.793888180490194
    }
  ]
}

我最初的方法是查看$http.get()调用返回的数据,并将一个JSON对象添加到一个数组中,然后我将该系列设置为等于但是效果不佳。还有哪些其他选项,或者有更简单的方法来获取格式。数据必须在Web服务上保留这种格式,因此无法进行更改。我有一个吸烟者,我正努力工作here

1 个答案:

答案 0 :(得分:1)

有趣的问题,我通常使用angular.forEach或称为下划线的库来处理angularJS中的数据处理。这是forEach版本。

data = $http.get(); // suppose you have the data
result = [];
angular.forEach(data.models, function(item) {
    // simple way is to take item as the original form
    result.push(item); 
    // or do your own way
    result.push({
        name: item.name,
        data: [item.score]
    });
});

现在结果变量就是你想要的变量。