D3.js'deki verileri yeniden oluşturmanın en iyi yolu

Question

Verilere dayanarak içerik oluşturmak için d3.js kitaplığını kullanıyorum.

İşte basitleştirilmiş bir örnek. Örneğin, yeni verilerim [5,3] şeklindeyse, dizimi değiştirirsem [5,3]. Yeni html’i yeniden adlandırmanın ve göstermenin en iyi yolu nasıl? Aynı cümleyi tekrar aramak zorunda mıyım yoksa daha iyi bir yol mu? Daha karmaşık bir veri yapısının durumunu ele alın. yani

data_arr = [obj1, obj2, obj3, obj4]; 

ve

ben obj1.field = 'newValue' yapmak ne olur

element.innerHTML = '<div id="innerDiv">' + d.field + '</div>'; 

. İsyan nasıl yapılır?

Teşekkürler!

Answer 1

Bir işlev kullanın. Örneğin, aşağıda dizelerden oluşan bir diziden bir listeyi oluşturacak bir işlev var: Artık listenizi başlatmak istiyorsanız

function list(ul, data) { 
    var li = ul.selectAll("li").data(data); 
    li.exit().remove(); 
    li.enter().append("li"); 
    li.text(function(d) { return d; }); 
} 

, şunları söyleyebilirsiniz:

d3.select("#list").call(list, [0, 1, 2, 3, 4]); 

Sonra sonra istersen güncelleştirme, şunları söyleyebilirsiniz: Eğer (ve yöntem zincirleme gerekmez) tercih ederseniz

d3.select("#list").call(list, [5, 3]); 

, sen selection.call olmadan bu yazabilirsiniz: