1

我正在使用 highcharts，当我动态填充数据时，它没有显示出来。这是我的代码：

<div id="chart"></div>

..

$(document).ready(function(e) {

    var options = {
        chart:{
            type:'line'
        },
        title:{
            text:'Line Chart'
        },
        xAxis:{
            title:'Date',
            categories:[]
        },
        yAxis:{
            title:'Val1/Val2'
        },
        series:[{name:'Val1', data:[]}, {name:'Val2', data:[]}]
    };

    $.ajax({
        url:'includes/getData.php', // select * from 'myTable' order by date
        dataType:'json',
        success:function(data){
            $.each(data, function(index, value){
                options.xAxis.categories.push(value.date); // date = 'mm/dd'
                options.series[0].data.push(value.val1); // val1 = integer
                options.series[1].data.push(value.val2); // val2 = integer
            });

            $('#chart').highcharts(options);
        }
    });

});

类别在 x 轴（日期）上显示得很好，但没有其他显示。如果我像这样对数据进行硬编码：

$(document).ready(function(e) {

    var options = {
        chart:{
            type:'line'
        },
        title:{
            text:'Line Chart'
        },
        xAxis:{
            title:'Date',
            categories:['08/16','08/17','08/18','08/19']
        },
        yAxis:{
            title:'Val1/Val2'
        },
        series:[{name:'Val1', data:[23, 56, 73, 12]}, {name:'Val2', data:[12, 65, 23, 49]}]
    };

    $.ajax({
        url:'includes/getData.php', // select * from 'myTable' order by date
        dataType:'json',
        success:function(data){
            $.each(data, function(index, value){
                //options.xAxis.categories.push(value.date); // date = 'mm/dd'
                //options.series[0].data.push(value.val1); // val1 = integer
                //options.series[1].data.push(value.val2); // val2 = integer
            });

            $('#chart').highcharts(options);
        }
    });

});

它完美地工作。请注意，我对 xaxis 类别数组和 2 系列数据数组进行了硬编码，并注释掉了 ajax 成功处理程序中的 3 行，它使用数据库中的数据进行填充。

不知道为什么它不是动态地硬编码。我在成功处理程序中将数据数组输出到控制台，并且数据就在那里，正如预期的那样。

有什么想法吗？

编辑：getData 返回的 JSON：

 0: {0:8, 1:120, 2:80, 3:08/06/2013, 4:1:00 am, id:8, val1:120, val2:80, date:08/06/2013, time:1:00 am}
 1: {0:5, 1:120, 2:80, 3:08/08/2013, 4:3:55 am, id:5, val1:120, val2:80, date:08/08/2013, time:3:55 am}
 2: {0:9, 1:120, 2:80, 3:08/10/2013, 4:2:00 am, id:9, val1:120, val2:80, date:08/10/2013, time:2:00 am}
 3: {0:13, 1:120, 2:80, 3:08/19/2013, 4:12:00 am, id:9, val1:120, val2:80, date:08/10/2013, time:2:00 am}
4

0 回答 0