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

Question

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

使用setData()

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

有任何想法吗？

Answer 1

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

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

Answer 2

"加载......"这个词似乎太业余了.改用这个技巧

var chart = new Highcharts.Chart(options);
chart.showLoading('<img src="/images/spinner.gif">');

$.getJSON(url, function(data){
       //load data to chart
       chart.hideLoading();
});

Answer 3

这是一个我总是用来显示加载的简单部分.

让我们说这是我们的容器

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

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

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

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