javascript - 使highchart成为动态数据驱动

我在将highchart栏标记为由数据库驱动的动态数据时遇到问题。我想在highchart的X轴和Series部分中制作动态数据。

在这里，我有一个查询，该查询从我的数据库中输出了几个月的数据，我想要将该数据放入我的highchart类别中，我的查询结果是这些JSON对象：

[{"datemonths":"February"},{"datemonths":"April"}]

这是我做过的或我正在尝试做的以使其动态化，但这听起来像是错误？

xAxis: {
           $.ajax({
               url: siteurl+"patients_report/bardata_date",
               type: "POST",
               dataType: "JSON",
                 success:function(data) {
                     alert(data);
                }
           });
      },

这是示例中要遵循的Highchart数据的格式：

//     Highcharts.chart('container', {
//     chart: {
//         type: 'bar'
//     },
//     title: {
//         text: ''
//     },
//     xAxis: {
//         categories: ['January', 'February', 'March', 'April', 'May', 'June']
//     },
//     yAxis: {
//         min: 0,
//         title: {
//             text: 'Detailed patient per clinic'
//         }
//     },
//     legend: {
//         reversed: true
//     },
//     plotOptions: {
//         series: {
//             stacking: 'normal'
//         }
//     },
//     series: [{
//         name: 'John',
//         data: [5, 3, 4, 7, 3, 2]
//     }, {
//         name: 'Jane',
//         data: [2, 2, 3, 2, 4, 2]
//     }, {
//         name: 'Joe',
//         data: [3, 4, 4, 2, 1, 3]
//     }]
// });

最佳答案

您无法通过ajax加载类别，您可以做的是将json处理到xaxis类别期望的数组中，并创建一个函数来加载图表，这将在ajax成功时调用

 $.ajax({
   url: "",
   type: "POST",
   dataType: "JSON",
   success: function(data) {
     var categories = new Array();
     for (var i in data) {
       categories.push(data[i]["datemonths"]);
     }
     loadChart(categories);
   }
 });

function loadChart(categories) {
   Highcharts.chart('container', {
     ...
     xAxis: {
       categories: categories
     },
     ...
   });
}

在此处http://jsfiddle.net/gbdfL4ra/1/进行小提琴，您必须单击“运行”以查看结果

我必须重写发送回您的Ajax调用的数据对象，因为我无权访问您的网址