Highcharts Cách hiển thị Đang tải hoạt ảnh tại dữ liệu được đặt

Question

Tôi có đồ họa highcharts. Khi tôi tạo ra trang của tôi, tôi thấy đồ họa có sản phẩm nào (Tôi không đặt thuộc tính dữ liệu và chỉ có chức danh của đồ họa, trong số đó là sản phẩm nào.) Tôi lấy dữ liệu từ máy chủ không đồng bộ và gọi

SetData()

chức năng lúc gọi lại. Tuy nhiên, người dùng thấy một trang trống và tôi muốn hiển thị một hình ảnh tải cho họ. Điều này: http://api.highcharts.com/highcharts#loading không hoạt động đối với tôi.

Bất kỳ ý tưởng nào?

Answer 1

tôi đã làm cho nó hoạt động như đã giải thích ở URL đưa ra:

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

Answer 2

Đây là một mảnh đơn giản tôi luôn luôn sử dụng để hiển thị các tải.

giả sử đây là container của chúng tôi

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

Và đây là mảnh ajax mà sẽ chăm sóc để hiển thị khi getJSON bắt đầu cho bảng xếp hạng và ẩn khi nó dừng lại.

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

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

Answer 3

Bạn có thể định nghĩa toàn cầu cho từng trang sử dụng plugin này JQuery Block UI

và sử dụng là

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(); 
    }); 

}); 

Answer 4

"Loading .." lời dường như quá nghiệp dư. Sử dụng mẹo đó thay vì

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

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