使用JSON数据

时间:2016-06-03 11:29:28

标签: javascript arrays json highcharts cartodb

我正在尝试使用cartoDB SQL返回的JSON数据绘制饼图。

我正在使用High Charts网站上提供的示例,但图表未加载。以下是我的javascript代码。你能看到什么问题吗?

$(document).ready(function() {
  var options = {
      chart: {
        renderTo: 'container',
        type: 'pie'
      },
      series: [{}]
  };

  var jsonURL = 'https://1025.cartodb.com/api/v2/sql?&q=SELECT status FROM kenya_primary_schools';

  $.getJSON(jsonURL, function(data) {
    var obj = data.rows, hObj = [];
    if(obj.length){
      for(var i=0; i<obj.length; i++){
        hObj.push([obj[i]['status']]);
      }
      console.log(hObj);
    }
    options.series[0].data = data;
    var chart = new Highcharts.Chart(options);
  });
});

2 个答案:

答案 0 :(得分:1)

在某种程度上修改代码后,我设法得到以下结果:

PRIVATE VS PUBLIC PIE CHART

您应该做的要点

您需要从Highcharts文档中查看如何从Highcharts doc

向series.data提供数据对象

由于cartoDB有两个选项:PRIVATE和PUBLIC,您应该考虑如何将它们存储在数组/对象中,以及如何从饼图中形成数据对象。

提示:

options.series [0] .data = data;

hObj.push([OBJ [I] [ '状态']]);

答案 1 :(得分:0)

您的代码中存在一些语法错误。你可以尝试这样纠正并再试一次。

$(document).ready(function() {
var options = {
    chart: {
        renderTo: 'container',
            type: 'pie'
    },
   series: [{}]
},
    jsonURL = 'https://1025.cartodb.com/api/v2/sql?&q=SELECT status FROM kenya_primary_schools';

$.getJSON(jsonURL, function(data) {
  var obj = data.rows,
     hObj = [],
    chart;
  if (obj.length) for (var i=0; i<obj.length; i++) hObj.push([obj[i].status]);
  options.series[0].data = data;
  chart = new Highcharts.Chart(options);
});
});