如何限制最初在d3中的節點數量強制定向圖

Question

這可能是另一個有待改進的問題，我在Existing question的幫助下做出了一個指令，該指令運行良好。

現在當用戶動態創建該圖表時，當數據加載超過時，瀏覽器變得沉重，用戶界面卡住了。

如何在最初加載圖表時將節點級別限制爲2。 我試圖一個接一個的服務電話，但這不起作用。

下面是代碼：

function click(d) { 
        if (d3.event.defaultPrevented) return; // ignore drag 
        if (d.children) { 
         d._children = d.children; 
         d.children = null; 
        } else { 
         d.children = d._children; 
         d._children = null; 
        } 
        update(); 
       } 

Application with Data

Answer 1

希望這會助陣。從這個例子：How can I start with all the nodes collapsed in d3js?

我編輯你的提琴：http://jsfiddle.net/thatOneGuy/yar5sco6/7/

我去掉了原來的呼叫update()。所以你必須按Load然後Start。

這會摺疊所有節點。從那裏，你可以打開前兩個層次相當容易:)

這是主要的實現：

// HTML

<button id='startForce'>START</button> 

// JS

document.getElementById('startForce').addEventListener('click', function() { 
      console.log('start'); 

      var nodes = flatten(root); 
      nodes.forEach(function(d) { 
       d._children = d.children; 
       d.children = null; 
      }); 
      update(); 
      })