带有异步调用的jqplot外部数据？答案

【问题标题】：jqplot external data with async call?带有异步调用的jqplot外部数据？
【发布时间】：2013-02-19 08:19:12
【问题描述】：

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

【问题讨论】：

如果它是同步的，它必须在加载时冻结。
很好 async:true 在后台加载，但要加载外部数据我必须使用 async:false 并且在加载数据之前停止运行代码
为什么？为什么不能使用异步请求加载外部数据？您使用什么库来加载 JSON？
此处为标准 jqplot 示例 > jqplot.com/tests/data-renderers.php

标签： ajax json asynchronous jqplot freeze

【解决方案1】：

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

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 调用成功时异步获取数据并绘制它。为了简单起见，我只是重新加载了同一个文本文件，尽管这可以很容易地适应您绘制实时数据流的场景。

【讨论】：

我是不是很密集？我不明白为什么重新绘制会用新数据更新图表？
经过一番测试，你的意思是plot2.replot({data:data})吗？
按照这个例子，我不知道在哪里放置缩放监听器、缩放重置监听器、调整大小监听器和历史复选框监听器。此外，带有标签的系列没有正确定位。