Highcharts图表未加载数据

时间:2013-06-06 15:42:35

标签: javascript jquery highcharts

我的控制器中的ajax功能正确点击页面,图表加载但是空白,我无法获取数据到达图表。我的代码如下。使用highcharts。谢谢!

控制器:

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
            }
        });
      }
    });

});

2 个答案:

答案 0 :(得分:0)

将您的数据传递给plotOptions.series将无法执行任何操作。

你的结果应该进入“系列”,例如:

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

假设您的“结果”格式类似于:

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

答案 1 :(得分:0)

您必须在图表配置中添加series而不是plotOptions

像这样:

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