2013-07-22 12 views
11

JavaScript ile oluşturulmuş bir KendoUI grafiğim var. PlotArea'yı bir komutla temizlemenin bir yolu var mı? Bir DataSource'un uzak verileri okumasını beklerken "Yükleme ..." görüntüsünü göstermek amacıyla. Görüntülenmesi ve yükleme animasyonu gizlemeKendoUI grafiği - veri yüklenirken nasıl animasyon gösterebilirim?

Teşekkür

+0

tam bir örnek Telerik dokümanlar sitesinde bunun için vardır: http://docs.telerik.com/kendo -ui/dataviz/chart/how-to/show-overlay-while-loading –

+0

Sanırım şimdi kendi kütüphanelerinin bir parçası olarak eklediler. Durum 2 yıl önce değildi ... Bağlantı için teşekkürler! –

cevap

19

geçerli:

// Display progress 
kendo.ui.progress($("#loading"), true); 

// Hide progress 
kendo.ui.progress($("#loading"), false); 

Sonra göstermek veya ilerleme animasyon gizlemek için zaman tanımaktır için DataSource içinde requestStart ve requestEnd olayları kullanmalıdır.

Grafik DataSource olacaktır: Burada

dataSource : { 
    transport : { 
     read: { 
      url:... 
     } 
    }, 
    sort  : { 
     field: "year", 
     dir : "asc" 
    }, 
    requestStart: function() { 
     kendo.ui.progress($("#loading"), true); 
    }, 
    requestEnd : function() { 
     kendo.ui.progress($("#loading"), false); 

    } 
}, 

Örnek: http://jsfiddle.net/OnaBai/kcptr/

+0

Bu temiz bir çözüm! Tek sorun, yükleme görüntüsünün sayfanın ortasında asılı kalmasıdır - sayfada birkaç çizelgeye sahibim ve bu yüzden yükleme görüntüsü grafik alanı içerisinde yer almalıdır: http://jsfiddle.net/ningencat/kcptr/ 2/Bu sorunu düzeltmeye nasıl başladınız? Teşekkürler –

+2

Sorun, yükleme kabının göreceli olarak ayarlanmış bir konumlandırmaya sahip olması gerektiğidir. Bunu deneyin: http://jsfiddle.net/OnaBai/kcptr/3/ – OnaBai

+0

+1 Harika cevap. Teşekkürler! –

İlgili konular