Highcharts图表未加载数据

Question

My ajax function in my controller is correctly hitting the page, the chart loads but its blank, I cannot get the data to reach the chart. My code is below. Using highcharts. Thanks!

Controller:

public function ajax_get_chart() {
      $series_data[] = array('series' => array(array('name' => 'John', 'data' => array(5, 7, 4))));
      $series_data[] = array('series' => array(array('name' => 'Tony', 'data' => array(5, 7, 4))));
      die (json_encode($series_data)); 

    }

Javascript:

var chart;

$(document).ready(function() {

    $.ajax({
      url: "/chart/ajax_get_chart", // the URL of the controller action method
      dataType: "json",
      success: function(result) 
      {

        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                defaultSeriesType: 'bar'
            },
            title: {
                text: 'Stacked bar chart'
            },
            xAxis: {
                categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Total fruit consumption'
                }
            },

            legend: {
                backgroundColor: '#FFFFFF',
                reversed: true
            },
            tooltip: {
                formatter: function() {
                    return ''+
                        this.series.name +': '+ this.y +'';
                }
            },
            plotOptions: {
                series: result
            }
        });
      }
    });

});

Answer 1

Passing your data to plotOptions.series won't do anything.

Your result should go inside "series", eg:

chart = new Highcharts.Chart({
            chart: {},
            title: {},
            xAxis: {},
            yAxis: {},
            legend: {},
            tooltip: {},
            plotOptions: {},
            series: result
        });

Providing that your "result" has a format similar to:

result = [{
        name: "One",
        data: [1, 2, 3, 4]
    }, {
        name: "Two",
        data: [1, 2, 3, 4]
    }
];

Answer 2

You must add series instead of plotOptions in your chart config.

Like this:

series: [{
    name: 'test',
    data: result
}]