javascript - Radial Reingold Tilford Tree 删除根节点

Question

我一直在寻找一种方法来从我的径向 Tilford 树中删除根节点，但到目前为止没有成功。我发现了一个类似的问题here ，但提供的答案不够具体，无法完全理解我需要在何处使用 d.depth > 0。我尝试将这行代码添加到有意义但未成功的位置(例如 node.append 和 .data(nodes))。附加的代码片段类似于用户@JSBob 在另一个问题中提到的位置，任何方向都会有所帮助，因为我是 D3 的新手!

function createVisualization(root){
  //if (error) throw error;
  drawLegend();
  var nodes = tree.nodes(root), 
      links = tree.links(nodes);
      console.log(nodes);

  var link = svg.selectAll(".link")
      .data(links)
    .enter().append("path")
      .attr("class", "link")
      .attr("d", diagonal);

  var node = svg.selectAll(".node")
      .data(nodes)
    .enter().append("g")
      .attr("class", "node")
      .attr("transform", function(d) {
        return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")"; })
      .on("mouseover", mouseOverArc)
      .on("mousemove", mouseMoveArc)
      .on("mouseout", mouseOutArc);

  node.append("circle").attr("r", 5)
  .style("fill", function(d) {
    if(d.size == 0) {
       return "#8c6226"; //Brown
    } else if(d.size == 1){
      return "#DC143C"; //Crimson
    } else if(d.size == 2){
      return "#FFA500"; //Orange
    } else if(d.size == 3){
      return "#32CD32"; //LimeGree
    } else if(d.size == 4){
      return "#1E90FF"; //DodgerBlue
    }
    ;})

Answer 1

使用:

var link = svg.selectAll(".link")
      .data(links)
    .enter().append("path")
      .filter(function(d) { return d.source.depth != 0})
      .attr("class", "link")
      .attr("d", diagonal);

删除指向根节点的链接

  var node = svg.selectAll(".node")
      .data(nodes)
    .enter().append("g")
      .filter(function(d) { return d.depth != 0})
      .attr("class", "node")
      .attr("transform", function(d) { return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")"; })

删除根节点

参见示例:http://plnkr.co/edit/GkXtUoAvUa6nijNCERxz?p=preview