【问题标题】:How to pass JSON data to update Highcharts Pie chart如何传递 JSON 数据来更新 Highcharts 饼图
【发布时间】:2018-04-15 00:06:35
【问题描述】:

我正在尝试对我的服务器进行 AJAX 调用并传入年份值。然后,服务器从数据库中获取有关当年不同国家经济的信息。然后我使用该数据从 Highcharts 更新饼图。

所以我的 AJAX 调用是这样的

$('#one').change(function() {
var val = $("#one option:selected").text();
var id = 'one';
$.ajax({
    type: "POST",
    url: "/sss",
    data: {val, id},
    dataType: 'JSON',
    success: function () { 
        console.log('success');
    },
    error: function (ts) {
        alert(ts.responseText);
        alert(val);
    }
  })
  .done(function (results){
    results = JSON.stringify(results);
    var chart = $('#char1').highcharts();
    chart.series[0].setData(results);
    /* chart.series[0].setData([ { name: 'USA', y: 19386200 },
    { name: 'China', y: 12059889 },
    { name: 'Japan', y: 4867528 },
    { name: 'Germany', y: 3753700 }]); */
    alert(results);
  })
});

那么我 POST 到 /sss 的路线是

router.post('/sss', function(req, res, next){
   console.log("sss");
   var yr = req.body.val;
   console.log(yr);

   var funnn = function(year, callback){
       uploadController.getGDPfunc(year, callback);
   }

   funnn(Number(yr), function(err,results){
      if(err) console.log("err");
      else{
          //console.log(results);
          res.send(results);
      }
   });
});

所以我从路由调用我的控制器函数,它以正确的格式返回结果。即使在 AJAX 中,我也可以记录结果并且它看起来是正确的格式。如果我要复制这些输出结果并将它们粘贴到 chart.series[0].setData(HERE) 中,那么它会起作用。但只有当我离开 chart.series[0].setData(results) 时它才能正常工作。

任何想法为什么会这样?如果我在 AJAX“完成”部分对数据进行硬编码,那么它会正确更新,所以我不认为图表渲染是问题所在。我觉得这是数据的格式,但是就像我说的那样,如果我要将它硬编码到 setData 中,它就可以工作......所以我迷路了。有什么想法吗?

谢谢

【问题讨论】:

  • 当您记录时,“结果”是什么样的?

标签: javascript json node.js ajax highcharts


【解决方案1】:

你从一个从 JSON 解析的对象开始,你不应该像这里那样再次将它字符串化为字符串:

results = JSON.stringify(results);

假设 results 为您提供了您所期望的对象,只需删除该行,以便您使用正确的对象(数组)而不是字符串调用 setData

【讨论】:

    猜你喜欢
    • 2012-01-03
    • 1970-01-01
    • 1970-01-01
    • 2020-10-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-06-21
    相关资源
    最近更新 更多