将JSON加载到Highcharts饼图

我想我可能有一个简单的问题。这个伟大的工程..将JSON加载到Highcharts饼图

$(document).ready(function() { // Original data var data = [{ "name": "Tokyo", "y": 3.0 }, { "name": "NewYork", "y": 2.0 }, { "name": "Berlin", "y": 3.5 }, { "name": "London", "y": 1.5 }]; var chart = new Highcharts.Chart({ chart: { renderTo: 'container', type: 'pie' }, series: [{ data: data }] }); });

我想修改代码使用的getJSON加载和JSON格式正确无误。所以我这样做...

$(document).ready(function() { $.getJSON("etstats?rtype=bestpgs_ec&month=2016-06-01&no_requested=10", function(json){ var data = json var chart = new Highcharts.Chart({ chart: { renderTo: 'container', type: 'pie' }, series: [{ data: data }] }); }); });

我查了JSON在Firebug和它使用 “名” 和 “y”

[{"name": "14704", "y": "0.17"}, {"name": "14706", "y": "0.20"}, {"name": "21304", "y": "0.25"}, {"name" : "23201", "y": "0.39"}, {"name": "23501", "y": "0.42"}, {"name": "17102", "y": "0.46"}, {"name": "15001" , "y": "0.48"}, {"name": "23002", "y": "0.50"}, {"name": "13201", "y": "0.50"}, {"name": "17401", "y" : "0.52"}]

没有人有任何指针作为格式正确无误为什么我的图表不会渲染？

注：编辑添加答案。引用的值是问题。通过遍历它们并评估值来删除它们。

$.getJSON("etstats?rtype=bestpgs_ec&month=2016-06-01&no_requested=10", function(json){ data = json $.each(data, function (i, point) { point.y = eval(point.y); }); var chart = new Highcharts.Chart({

来源

2016-07-26 Jane WIlkie

不确定它是否相关，但您的''y'''值在第二个版本中有双引号，并且不在第一个引号中。 – pmahomme

我使用上面给出的数据。我认为highchart只是不接受string型y

这里是demo

一个有效的JSON格式应该是

[ 
    {"name":"14704","y":0.17}, 
    {"name":"14706","y":0.2}, 
    {"name":"21304","y":0.25}, 
    {"name":"23201","y":0.39}, 
    {"name":"23501","y":0.42}, 
    {"name":"17102","y":0.46}, 
    {"name":"15001","y":0.48}, 
    {"name":"23002","y":0.5}, 
    {"name":"13201","y":0.5}, 
    {"name":"17401","y":0.52} 
]

后您的getJSON完成后，记得做JSON.parse首先要得到正确的对象，然后你终于可以通过它进入高图

来源

2016-07-27 02:20:18 Even

hiEven：就是这样！我修改了上面的答案以评估值并删除引号。 –

你能确认你的getJSON响应是JSON字符串？如果是的话，你应该这样做：

var data = JSON.parse(json);

来源

2016-07-27 02:17:50 TTCC

这是我的解决方案来更新MySQL饼图使用jQ uery

首先，在PHP中：创建数组与值/名称对的数组，并确保您返回 “json_encode” d数据：

... [code] ... 
    while($aRow = mysqli_fetch_assoc($oRes)){ 
     $aData[] = array("y" => $aRow['number'], "name" => $aRow['string']); 
    } 
    exit(json_encode($aData));

二，创建图表：

oGraph = new Highcharts.chart({ 
     chart: { 
      renderTo: 'graphid', 
     ... [code] ... 
     plotOptions: { 
      pie: { 
     ... [code] ... 
     series: [{ 
      name: 'MyName', 
      data: [] 
     ... [code] ... 
    });

第三，建立jQuery代码检索数据：

$.ajax({ 
     type  : 'post', 
     url  : '/path/to/the/above/php/data-script.php', 
     dataType : 'json' 
    }).done(function(oJson) { 
     var oObj = []; 
     $.each(oJson, function(ix,sliceData) { 
     oObj.push({ 
      name: sliceData.name, 
      y: eval(sliceData.y) 
     }); 
     }); 
     oGraph.series[0].setData(oObj, true); 
    });

我花了一整天认识到，我不得不（1）重新打包数据和（2）使用eval（）作为值参数y !!!

来源

2018-01-13 19:00:46 user1376490

将JSON加载到Highcharts饼图

回答

相关问题