径向Reingold-Tilford树删除根节点

Question

我一直在寻找一种方法从径向Tilford树中删除根节点，但迄今为止没有成功。我在这里找到了一个类似的问题，但是提供的答案并不具体说明我需要在何处使用 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
    }
    ;})

- dw03

Answer 1

@JSBOB说的是，当你为根节点制作圆形时，请将其半径设置为0，如下所示：

  node.append("circle")
    .attr("r", function(d) {
      if (d.depth == 0) {//for root node depth will be 0
        return 0;//make the circle's radius 0 for root node.
      } else {
        return 4.5;
      }
    }).style("fill", function(d) { ... });

工作样本 这里

- Cyril Cherian

---

你应该添加 if(d.depth ==0){return ""} else return d.name; 以移除标题。 - Tim B

是的，我同意。但是在楼主提供的代码片段中，@Tim并没有提到任何文本部分，所以我也没有提到它。 - Cyril Cherian

Answer 2

使用：

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

- Tim B

---

啊，我不知道有过滤函数。这真的很有帮助，谢谢Tim！跟进问题，现在我正在显示所有深度大于0的节点，是否可能重新调整我的深度为1的节点？我尝试了调整转换值，但没有成功。 - dw03

你想合并所有深度为1的节点吗？ - Tim B