Highcharts加载数据而不是绘图

Question

我正在尝试将数据动态加载到Highcharts中，但我遇到了问题。我试图以很多方式做到这一点，数据似乎被加载到JS但是图表没有被绘制。

目前这是我在jQuery的document ready函数中的代码：

options = {
    chart: {
        renderTo: 'container',
        zoomType: 'x',
        animation: true,
    },
    title: {
        text: null
    },
    subtitle: {
        text: null
    },
    xAxis: {
        type: 'datetime',
        title: {
            text: null
        },
    },
    yAxis: {
        title: {
            text: 'Size',
        },
    },
    legend: {
        enabled: false
    },

   series: [{
        data: []
    }]
}

$.ajax({
        type: "GET",
        url: "works/load_data.php",
        data: "id=3&mdate=2012-02&mxdate=2012-03",
        success: function (items) {

            var obj = eval(items).load;
            var series = { data: [] };

            $.each(obj, function (itemNo, item) {
                series.data.push(item);
            });

            options.series.push(series);

        },
        cache: false,
});
var chart = new Highcharts.Chart(options);

图表上没有任何结果。但是，如果我登录控制图表选项，我会得到这个：

我的PHP回应了这样的数据： data = {load:[ {x: Date.UTC(2012,2,1,7,15), y: 0.012},{x: Date.UTC(2012,2,1,7,30), y: 0.068} ... ]}

至少对我来说似乎没问题。但它不起作用:(有人可以告诉我我做错了吗？谢谢。

Answer 1

AJAX是异步的，这意味着在渲染图表后调用会发生。尝试在成功事件之后坚持创建图表，如下所示：

$.ajax({
        type: "GET",
        url: "works/load_data.php",
        data: "id=3&mdate=2012-02&mxdate=2012-03",
        success: function (items) {

            var obj = eval(items).load;
            var series = { data: [] };

            $.each(obj, function (itemNo, item) {
                series.data.push(item);
            });

            options.series.push(series);


            var chart = new Highcharts.Chart(options);

        },
        cache: false,
});