高图表 - 无法通过 AJAX 填充序列数据 - High Charts - Unable to populate series data via AJAX

High Charts - Unable to populate series data via AJAX

本文关键字：填充数据 AJAX 高图表 | 更新日期: 2023-09-27

我遇到了一件简单的事情，那就是使用 HighChart 在基本柱线中加载系列数据。我已经使用 AJAX 调用返回了数据，但问题是当返回数据时，图表没有加载。但是，如果我连续复制/粘贴返回的数据，它可以正常工作。

提一下，我没有使用JSON编码。我只是做了弦并附和它。下面是我真正想要实现的目标，我的 JS/HTML 和我想要显示的返回字符串

高图示例：

http://www.highcharts.com/demo/bar-basic

我的 Javascript 和 HTML

http://jsfiddle.net/7c3gqwr9/

我返回的数据：

{name:'Total_Trans',data:[8798,88976,18564,8486]}, {name:'Sucesss',data:[6304,57642,8702,5202]}, {name:'MoreThan30',data:[208,1588,449,163]}, {name:'LessThan30',data:[8551,86864,18034,8290]}, {name:'NadraMoreThan30',data:[1535,4187,2634,1310]}, {name:'NadraLessThan30',data:[6024,66179,9812,5239]}

返回的数据不是 JSON。

至少它需要在"[]"符号内。而不是

{name:'Total_Trans',data:[8798,88976,18564,8486]}, {name:'Sucesss'...,5239]}

你需要有

[{name:'Total_Trans',data:[8798,88976,18564,8486]}, {name:'Sucesss'...,5239]}]

您是否有机会从foreach()内输出几个json_encode()？

你应该做：

$series = array();
foreach (...) {
     $series[] = array(
         'name'  => $record['name'], // "Hello world"
         'data'  => $data, // array(1,2,3,4);
     );
}
Header('Content-type: application/json');
die(json_encode($series));

如果数据行本身来自另一个周期，则需要类似

$series = array();
foreach (...) {
     $data = array();
     foreach (...) {
         $data[] = $tuple['value'];
     }
     $series[] = array(
         'name'  => $record['name'], // "Hello world"
         'data'  => $data, // array(1,2,3,4);
     );
}
Header('Content-type: application/json');
die(json_encode($series));

您可以在调用 AJAX 之前正常声明 HighCharts 图表。它将显示一个空图形，您将拥有一个HighCharts对象。您也可以在 AJAX 返回函数中执行此操作，但最好事先准备好图表。

然后你可以调用 AJAX 来获取一个数据块，它仍然需要正确的 JSON（没有其他简单的方法），并对其进行解码：

var ch = $('#container').highcharts();
for (blk in jawad) {
    ch.addSeries(javad[blk]);
}

但要做到这一点，你的 AJAX 也必须返回一个正确的 JSON 数组，其中包含正确的 MIME 类型。如果它返回一个字符串，则整个设置根本不起作用。