Highcharts有Ajax请求问题

时间:2016-03-13 16:25:41

标签: jquery ajax highcharts

我想在高图图表中显示一个系列。数据应来自我的db(ajax请求)。查询大约需要7-8秒,直到我收到回复,我猜这可能是问题所在。

如果我使用与普通数据完全相同的ajax响应,我可以按预期看到图表。如果我使用直接响应变量(数据),它将无法工作,也不会显示图形。普通数据与ajax响应100%相同(我复制了console.log)。我不知道为什么会这样。

这有效:

function loadBotStatistics(){
    $("#loadingImage").show();

    $.post( "ajax_load_bot_statistics.php", function (data){
        $('#container').highcharts({
            chart: {
                renderTo: 'container',
                type: 'line'
            },
            xAxis: {
                type: 'datetime'
            },
            title: {
                text: 'Logins from unique Members'
            },
            series: [{
                type: 'line',
                name: 'Logins',
                data: [{"y":31713,"0":31713,"x":1456379177000,"1":1456379177000,"session_end":"2016-02-25 06:46:17","2":"2016-02-25 06:46:17"},{"y":31474,"0":31474,"x":1456452049000,"1":1456452049000,"session_end":"2016-02-26 03:00:49","2":"2016-02-26 03:00:49"},{"y":29099,"0":29099,"x":1456558947000,"1":1456558947000,"session_end":"2016-02-27 08:42:27","2":"2016-02-27 08:42:27"},{"y":28108,"0":28108,"x":1456674895000,"1":1456674895000,"session_end":"2016-02-28 16:54:55","2":"2016-02-28 16:54:55"},{"y":31365,"0":31365,"x":1456704987000,"1":1456704987000,"session_end":"2016-02-29 01:16:27","2":"2016-02-29 01:16:27"},{"y":31201,"0":31201,"x":1456858522000,"1":1456858522000,"session_end":"2016-03-01 19:55:22","2":"2016-03-01 19:55:22"},{"y":30999,"0":30999,"x":1456906468000,"1":1456906468000,"session_end":"2016-03-02 09:14:28","2":"2016-03-02 09:14:28"},{"y":31630,"0":31630,"x":1456960648000,"1":1456960648000,"session_end":"2016-03-03 00:17:28","2":"2016-03-03 00:17:28"},{"y":29508,"0":29508,"x":1457069814000,"1":1457069814000,"session_end":"2016-03-04 06:36:54","2":"2016-03-04 06:36:54"},{"y":28399,"0":28399,"x":1457143229000,"1":1457143229000,"session_end":"2016-03-05 03:00:29","2":"2016-03-05 03:00:29"},{"y":29520,"0":29520,"x":1457273151000,"1":1457273151000,"session_end":"2016-03-06 15:05:51","2":"2016-03-06 15:05:51"},{"y":28447,"0":28447,"x":1457321588000,"1":1457321588000,"session_end":"2016-03-07 04:33:08","2":"2016-03-07 04:33:08"},{"y":29396,"0":29396,"x":1457393708000,"1":1457393708000,"session_end":"2016-03-08 00:35:08","2":"2016-03-08 00:35:08"},{"y":31021,"0":31021,"x":1457533934000,"1":1457533934000,"session_end":"2016-03-09 15:32:14","2":"2016-03-09 15:32:14"}]
            }]
        });
        console.log(data);
        $("#loadingImage").hide();
    });

}

这不起作用(空图):

function loadBotStatistics(){
    $("#loadingImage").show();

    $.post( "ajax_load_bot_statistics.php", function (data){
        $('#container').highcharts({
            chart: {
                renderTo: 'container',
                type: 'line'
            },
            xAxis: {
                type: 'datetime'
            },
            title: {
                text: 'Logins from unique Members'
            },
            series: [{
                type: 'line',
                name: 'Logins',
                data: data
                }]
        });
        console.log(data);
        $("#loadingImage").hide();
    });

}

为什么一旦我使用数据变量而不是硬编码的相同响应,它就无法工作?

1 个答案:

答案 0 :(得分:0)

试试这个:

function loadBotStatistics(){
    $("#loadingImage").show();
    $('#container').highcharts({
            chart: {
                renderTo: 'container',
                type: 'line'
            },
            xAxis: {
                type: 'datetime'
            },
            title: {
                text: 'Logins from unique Members'
            }
        });
    $.post( "ajax_load_bot_statistics.php", function (data){
        var chart = $('#container').highcharts();
        if (chart.series.length === 1) {
            chart.addSeries({
                type: 'line',
                name: 'Logins',                    
                data: data
            });
        }
        $("#loadingImage").hide();
    });

}