İçerdiği div değişiklikleri

Question

boyutunda bir Flot grafiğini yeniden boyutlandırma Grafit kitaplığı jQuery eklentisini kullanıyorum ve <div> değişiklik boyutunu içerdiğinde grafiğin yeniden boyutlandırılması için iyi bir yol bulamadım. yeniden boyutlandırmak için). Onresize olayını ele alırken, içerdiği 'un genişliğinin ve yüksekliğinin doğru boyuta güncellendiğinden emin olduktan sonra hem setupGrid'i çağırmayı denedim hem de çizim nesnesine çizim yapıp hiçbir etkisi olmadan. İçerdiği <div>'u kaldırmanın ve okumanın ve grafiği grafiğin yeniden çizme yaklaşımında bazı başarılar elde ettim. Ancak, bu yeniden boyutlandırma olayları tetikleyebilir tahmin olarak ben (aynı zamanda grafik için araç ipuçları için) aynı anda diğer <div> öğeleri eklemek gerekiyorsa, bu sonsuz yeniden boyutlandırma olay döngüleri sıkışmış eğilimli gibi görünüyor ? Eksik olduğumu halletmenin iyi bir yolu var mı?

Answer 1

Pencerede yeniden boyutlandırma olayına bağlamayı buldum ve çağrı arzı gerçekten iyi çalışıyor. Örneğin, veri ve seçeneklerimi sayfadaki değişkenlerde saklıyorum. Sonra kurulum bu $ (belge) .ready():

$(window).resize(function() {$.plot($('#graph_div'), data, opts);});

Answer 2

Ben görünüyor (Ben de bunun bir ilgisi olabilir eğer Flot kullanabilmek için amacıyla IE için ExplorerCanvas kullanıyorum. Gerçekten henüz diğer tarayıcılarda denemedim) bir çözüm bulmuş olmakla birlikte, neden işe yaramadığından emin değilim. Halen belgeden 'u kaldırma ve okuma ve belgeyi grafik içinde yeniden yazma yaklaşımını kullanıyorum. Ancak redrawFunc belgeye yaptıklarını bağlı sonsuz döngü gibi görünüyordu girmesini eğilimli görünüyordu

window.onresize = redrawFunc; //redrawFunc removes and readds the containing div and replots 

yapıyor vardı nerede daha önce.

Onun yerine bağlayıcı jQuery'nin yeniden boyutlandırma kullanarak çalıştı

$(window).resize = redrawFunc; 

Şimdiye kadar olursa olsun ben henüz bir döngü sıkışmış Bu yaklaşım ile ilgili bir sorun olmadı redrawFunc doküman yapmak başka hangi değişiklikler . Sadece neden emin değilim.

Answer 3

Kendime sadece buna bir çözüm buldu. Aramamı özel sorunumun orijinal nedeni olabilir, ancak jQuery resize olayını kullandığımda bile zamanlamayı yeniden boyutlandırmayı reddettiğim için $.plot() aramamı yaptım.

$(window).resize(function() { 
    // erase the flot graph, allowing the div to shrink correctly 
    $('#graph_div').text(''); 

    // redraw the graph in the correctly sized div 
    $.plot($('#graph_div'), data, opts); 
}); 

Answer 4

flot API docs son sürümü, en azından tanıtıldığı gibi çalışıyor, yeniden boyutlandırma olayı şöyle anlatır: Burada her şeyi sabit benim kod değişikliktir.

boyutlandırma()

tutucu boyutuna çizim tuvali yeniden boyutlandırmak için flot bildirir. SetupGrid() ve draw() 'ı daha sonra olarak yeniden boyutlandırmanız gerekir. Tuval yeniden boyutlandırma, yıkıcı bir işlemdir. Bu, yeniden boyutlandırma eklentisi tarafından dahili olarak kullanılır.

Answer 5

En kolay yol, yeniden boyutlandırma eklentisini kullanmaktır.http://www.flotcharts.org/flot/examples/resize/

Ama sadece burada

<script language="javascript" type="text/javascript" src="../../jquery.flot.resize.js"></script>