d3.js

2013-04-10 13 views
15

में संकुचित/पदानुक्रमित और बल-निर्देशित ग्राफ बल-निर्देशित ग्राफ (यानी नोड्स और लिंक) और ढहने वाले पेड़ (यानी अभिभावक-बच्चे नोड्स) के कई उदाहरण हैं लेकिन मुझे संयोजन का एक उदाहरण नहीं मिल रहा है ये - इस तरह के कुछ 1-स्तरीय क्लस्टर नेटवर्क के अलावा - http://static.cybercommons.org/js/d3/examples/force/force-cluster.htmld3.js

enter image description here

है कि मैं एक पूर्ण नोड्स के (स्तर के किसी भी संख्या के साथ) पदानुक्रम भर में विभिन्न नोड्स के बीच लिंक के साथ पदानुक्रम की जरूरत है।

क्या किसी को इसका कोई उदाहरण मिला है?

और यदि ऐसा है तो मैं अंततः पदानुक्रमों को ढीला देखना चाहता हूं और बच्चों के किसी भी लिंक को गिरने पर माता-पिता तक 'ऊंचा' किया जाता है।

चीयर्स, टिम

यह मैं क्या jsonData तरह देखने के लिए उम्मीद थी के समान है ...

{ 
"nodes": [ 
    { 
     "name": "Parent 1", 
     "children": [ 
      { 
       "name": "Child 1", 
      }, 
    }, 
    { 
     "name": "Parent 2", 
     "children": [ 
      { 
       "name": "Child 2", 
      }, 
. 
. 
. 
"links": [ 
    { 
     source: "Child 1", 
     target: "Child 2" 
    }, 
. 
. 

उत्तर

3

मैं भी इस में दिलचस्पी रखता हूँ। मुझे दो उदाहरण मिल गए हैं, जिन्हें मैं गठबंधन करना चाहता हूं।

http://bl.ocks.org/mbostock/1062288 http://graus.nu/d3/

+0

हाँ, बिल्कुल ... एक d3 का उपयोग करता दर्शाती है माता-पिता और बच्चों को जोड़ने के लिए 'लिंक'। दूसरे में पदानुक्रमों में नोड्स के बीच स्पष्ट 'लिंक' हैं (चाहे वे माता-पिता हों या बच्चे हों)। – DrTim

+0

मैंने दो में विलय करने का प्रयास नहीं किया है, है ना? – Marinus

+0

संख्या। उपरोक्त लिंक के अनुसार एक-स्तरीय समूहबद्ध ग्राफ के कई उदाहरण हैं, और "पदानुक्रमित एज बंडलिंग" नमूना - http://mbostock.github.io/d3/talk/20111116/bundle.html - समान डेटा संरचना का उपयोग करता है (लेकिन केवल पत्ता नोड्स को जोड़ा जा सकता है)। समाधान के साथ अभी भी कोई भाग्य नहीं है ... – DrTim

7

मैं यहाँ दोनों उदाहरण विलय करने की कोशिश मेरी fiddle

// Toggle children on click. 
function click(d) { 
if (d.children) { 
    d._children = d.children; 
    d.children = null; 
} else { 
    d.children = d._children; 
    d._children = null; 
} 
update(); 
} 
4

यहाँ एक अच्छा उदाहरण है कि दोनों गुण http://bl.ocks.org/mbostock/1093130

+0

यह दोनों गुणों को प्रदर्शित नहीं करता है। यह केवल ढहने योग्य संपत्ति दिखा रहा है। – Jaydipsinh