扩展活动或仅一个分支的d3树图加载

Question

我在Angular中使用D3.js。下面是我的组件。会产生以下输出。

如何仅以展开方式打开一个活动分支（例如：仅Level2：B分支应以展开方式加载，而Level 2：A分支应以折叠方式加载。

expand('Daughter of A');

function expand(d){
  if(d._children){
      d.children = d._children;
      d.children.filter(function(d) { return d.name.indexOf("SpecialNode") > -1; })
                .forEach(expand);
      d._children = null;
  }

}

Answer 1

向每个称为expand的数据添加一个布尔属性，对于根级别和级别2 B将其设置为true，并在调用expand时进行检查。在扩展其父节点时，将所有子级的递归设置为true，以便将来也可以对其进行扩展。

function expand(d){
  if(d._children){
      d.children = d._children;
      d.children.filter(function(d) { 
          const toExpand = d.expand;
          d.expand = true;
          return d.name.indexOf("SpecialNode") > -1 && toExpand; 
      })
      .forEach(expand);
      d._children = null;
  }