2016-01-28 49 views
0

我有一个很好的折叠力布局,从http://bl.ocks.org/mbostock/1093130开始折叠。d3.js可折叠的力图 - 为唯一的ID分配相同的节点

这是我的例子:http://plnkr.co/edit/rqh8SD?p=preview

它运作良好,当所有的节点都具有唯一的名称(http://plnkr.co/edit/E1n6asBM5VfX2vjGPkKO?p=preview),但只要一些节点具有相同的名称(不幸的是我需要的),塌陷不起作用正常。

任何人都可以帮助我为节点的相同名称分配唯一的ID?我相信这段代码可以诀窍,但我不知道在哪里插入它。

node.each(function(d,i){ // use i to iterate through 
    d.uniqueID = uniqueNode + i; 
} 

我试图在我之前的线程D3.js Collapsible Force Layout, collapsed by default解决这个问题 - 不成功。

任何帮助表示赞赏!

回答

0

做这样的事情,使所有的节点独特应该工作。刚过您汇整的节点,我建议这样做,但你插入力之前他们向图:

功能的更新(d){

var nodes = flatten(root), 
    links = d3.layout.tree().links(nodes); 

nodes.each(function(d, i) { d.uniqueID = i; }); 

// Restart the force layout. 
force 
    .nodes(nodes) 
    .links(links) 
    .start(); 

您还需要更新您的钥匙功能这些节点

// Update nodes 
    node = node.data(nodes, function(d) { return d.uniqueID; }); 

你需要采取但是请注意,如果你改变你的数据,你的绑定可能是错误的使用.data()时。如果你要插入一个新值,那么将会把所有索引都加1,这可能会导致你在未来将数据加入到错误的元素中。

解决该问题的一种可能的不同方式可能是更改您的关键功能以查看直接父母(或父母)的ID。