2


有没有办法通过异步调用将外部数据加载到 jqplot 中?
我想要一个每分钟更新一次的实时图表,但是每次从服务器接收数据时,使用 async:false 页面都会冻结。

4

1 回答 1

4

在示例中这样做的原因是为了简单起见。以下是对此的异步改造

var plot2 = null;

function fetchAjaxData(url, success) {
    $.ajax({
        url: url,
        dataType:"json",
        success: function(data) {
            success(data);
            console.log('loaded');
        }
    });
}

function createPlot(url) {
    fetchAjaxData(url, function(data) {
        if (plot2 == null) {
            plot2 = $.jqplot('chart2', data, {
                title: "AJAX JSON Data Renderer"
            });
        } else {
            plot2.replot({data: data});
            console.log('replotting');
        }
    });
}

$(document).ready(function(){
    var jsonurl = "./jsondata.txt";

    //Regenerate the plot on button click.
    $('#ajax-button').click(function() {
        createPlot(jsonurl);
    });

    //Generate the plot first time through.
    createPlot(jsonurl);
});

并使用 HTML:

<div id="chart2" style="height:300px; width:500px;"></div>
<button id="ajax-button">Ajax retrieve</button>

所以它的作用是在 Ajax 调用成功时异步获取数据并绘制它。为了简单起见,我只是重新加载相同的文本文件,尽管这可以很容易地适应您正在绘制实时数据流的场景。

于 2013-02-21T20:52:57.700 回答