0

我有以下内容：

plot($('#pageviews'), 'line', {
  labels: ['1', '2', '3', '4', '5', '6', '7', '8'],
  datasets: [
    { 
      fillColor: rgba("#404040", 0.25), 
      data: [20, 24, 28, 30, 26, 18, 16, 10] 
    }
  ]
});

我有一个 URL，“/data/stats/pageviews”，它返回 JSON：

[{“标签”：“1”，“数据”：2}，{“标签”：“2”，“数据”：20}，{“标签”：“4”，“数据”：20}]

我尝试了以下方法：

$.ajax({
  url: '/data/stats/pageviews',
  dataType: 'json'
}).success(function (data) {

  plot($('#pageviews'), 'line', {
    labels: data.Labels,
    datasets: [
      { 
        fillColor: rgba("#404040", 0.25), 
        data: data.Data
      }
    ]
  });

});

这不起作用......我认为问题在于我如何使用数据。是吗？

谢谢你，米格尔

4

2 回答 2

2

问题是 usingdata.Labels不会获取Label数据中所有键的值，因为它们存储在数组中的各个项目中。因此，我们将不得不遍历你的每个数组项，每个数组项data都是一个对象，然后我们可以访问 和 的Labels值Data。此小提琴提供此代码的演示：http: //jsfiddle.net/teddyrised/hHE2r/3/

var data = [ { "Labels": "1", "Data": 2 }, { "Labels": "2", "Data": 20 }, { "Labels": "4", "Data": 20 } ];

// Declare new arrays
var dataLabels = [],
    dataData = [];

// Loop through returned data
$.each(data, function(key, value){
    dataLabels.push(this.Labels);
    dataData.push(this.Data);
});

console.log(dataLabels);
console.log(dataData);

因此，为了将其集成到您的 AJAX 调用中，我们可以执行以下操作：

$.ajax({
    url: '/data/stats/pageviews',
    dataType: 'json'
}).success(function (data) {

    // Declare new arrays
    var dataLabels = [],
        dataData = [];

    // Loop through returned data
    $.each(data, function(key, value){
        dataLabels.push(this.Labels);
        dataData.push(this.Data);
    });    

    // Draw lot
    plot($('#pageviews'), 'line', {
        labels: dataLabels,
        datasets: [{
            fillColor: rgba("#404040", 0.25),
            data: dataData
        }]
    });

});
于 2013-11-09T23:08:02.453 回答
0

您可以调用 ajax 请求，然后根据请求返回的内容设置绘图参数，如下所示：

 $.ajax({
    url:"/data/stats/pageviews",
    dataType:'json'
    success:function(obj){
        plot($('#pageviews'), 'line', {
            labels: obj.Labels,
            datasets: [
             { 
                fillColor: rgba("#404040", 0.25), 
                data: obj.Data
             }
            ]
        });
    }
  });

返回的 JSON 对象必须采用以下格式：

{"Labels": ["1", "2", "3", "4", "5", "6", "7", "8"],
 "Data": [20, 24, 28, 30, 26, 18, 16, 10]
}
于 2013-11-09T22:27:45.447 回答