D3 Kabarcık Örneği: bubble.nodes() ne yapar?

Question

Örnek: http://mbostock.github.com/d3/ex/bubble.html

Ben çizgi 16 ile bitenler anlamakta zorlanıyorum:) sınıfları içinde

.data(bubble.nodes(classes(json)) 

Ve neden, ya da nereye (function, değişken sınıfları [] her nesnesi için tanımlanmış x, y, r değerlerini alır. Ayrıca, bubble.nodes() gerçek bir işlev olarak görünmüyor mu?

Ben hatları 44 ile 45 arasında bir

console.log(classes) 

eklerseniz - her içeride itiraz zaten x, y, r ile doldurulması gibi görünüyor - ama bu durumda neden belirgin değildir.

Answer 1

Sınıflar() işlevi öznitelikleri eklemez. Sadece ağacı düzleştirir. özellikler bubble.nodes içine ilave edilir() (ki d3.layout.pack olan(). düğümleri())

JSON.stringify(classes[0]) 
"{"packageName":"cluster","className":"AgglomerativeCluster","value":3938}" 

Answer 2

bubble.nodes() çağrısı bubble=d3.layout.pack() yana d3.layout.pack().nodes() bir çağrı kaynar. Hile pack.nodes()children (bu durumda tüm paketleri) value anahtarı (bu durumda tüm paketleri) düğümleri (r ekleyin) kullanmak ve konumunu belirlemek (x ve y ekleyin) kullanmak için kodlanmıştır. Özünde

,

var root = {"children": [ 
       {"packageName":"cluster","className":"AgglomerativeCluster","value":3938}, 
       {"packageName":"cluster","className":"CommunityStructure","value":3812}, 
       {"packageName":"cluster","className":"HierarchicalCluster","value":6714}, 
       {"packageName":"cluster","className":"MergeEdge","value":743} 
     ]}; // This is an excerpt of the real data. 

var bubble = d3.layout.pack(); 

// pack.nodes() assigns each element of "children" a r, x, and y based on value 
bubble.nodes(root); 

Bu

, sen classes() bu özellikleri içermediğinden classes(root) beri r, x ve y eklemez olduğunu görebilirsiniz ilk yanı beni takıldı. Krasnaya'nın cevabı bunun çoğuna değindi ama biraz daha açıklamaya ihtiyacım olduğunu hissettim (en azından benim için yaptı).