Highcharts如何在设置数据中显示加载动画

时间:2012-08-27 19:25:25

标签: javascript jquery highcharts

我有高图形图形。当我创建我的页面时,我显示空图形(我没有设置数据属性,只有图形标题,它们内部是空的。)我从服务器异步获取数据并调用

  

使用setData()

回调时起作用。但是,用户看到一个空白页面,我想为他们显示加载图像。这个:http://api.highcharts.com/highcharts#loading对我不起作用。

有什么想法吗?

4 个答案:

答案 0 :(得分:17)

我按照给定的URL解释了它的工作原理:

function updateGraphic(url, chartName) {
    chartName.showLoading();
    $.getJSON(url, function(data){
        chartName.series[0].setData(data);
        chartName.hideLoading();
    });
}

答案 1 :(得分:13)

"中.."这个词似乎太业余了。请使用该技巧

id=template

答案 2 :(得分:5)

这是一个我总是用来显示载荷的简单作品。

让我们说这是我们的容器

<div id='container'>
  <img id="spinner" src="/assets/chart_loader.gif"/>
</div>

这是ajax的一部分,它会在getJson为图表启动时显示,并在停止时隐藏。

$(document).ajaxStart ->
  $("#spinner").show()

$(document).ajaxComplete ->
  $("#spinner").hide()

答案 3 :(得分:0)

您可以使用此插件JQuery Block UI

为每个页面全局定义

并且用法是

  jQuery(document).ready(function ($) {
        $.ajaxSetup({ cache: false });
        $(document).ajaxStart(function () {
        $('body').block({
            message: '<h3><img alt="" class="GifIcon" src="Images/319.gif" />Please wait Data is Loading From Server ...... </h3>'
        });
    });
    $(document).ajaxStop(function () {
        $('body').unblock();
    });

});