d3.js樹形佈局：展開時摺疊其他節點？

Question

在使用d3.js（example）的樹形佈局中，我想摺疊不在分支中的已被點擊的節點。

例如，在上述的演示中，嘗試以下方法：

1. 點擊 「父1」（兒童1和子2被示出）
2. 點擊 「兒童1」（兒童1.1是所示）
3. 點擊「孩子2」（兒童2.1所示）

現在你應該看到兩個「孩子1」和「2兒童」的孩子。

我想有以下發生：

1. 點擊 「家長1」（兒童1兒童2所示）
2. 點擊 「孩子1」（兒童1.1所示）
3. 點擊「孩子2」（兒童2.1所示，兒童1.1隱藏）

所以比「活動」分支其他節點的孩子應該被隱藏。

我該如何做到最好？ （當然有效，因爲我將使用相當大的數據集）

Answer 1

一個簡單的解決方案是修改點擊函數，使得如果節點有父節點，父節點的子節點都會摺疊，但只有當子節點不是被點擊的節點。

function click(d) { 
    if (d.children) { 
    d._children = d.children; 
    d.children = null; 
    } else { 
    d.children = d._children; 
    d._children = null; 
    } 
    // If the node has a parent, then collapse its child nodes 
    // except for this clicked node. 
    if (d.parent) { 
    d.parent.children.forEach(function(element) { 
     if (d !== element) { 
     collapse(element); 
     } 
    }); 
    } 
    update(d); 
} 

更新jsbin：http://jsbin.com/etIJABU/2/edit

Answer 2

，如果你想，當你點擊有子節點只崩潰的其他節點，在第二IF加上 「& & d.children」 ..

function click(d) { 
     if (d.children) { 
      d._children = d.children; 
      d.children = null; 
     } 
     else { 
      d.children = d._children; 
      d._children = null; 
     } 
     if (d.parent && d.children) { //add here, 
      d.parent.children.forEach(function(element) { 
     if (d !== element) { 
     collapse(element); 
     }}); 
     } 
     update(d); 
     }