D3 덴도 그램에서 내부 및 리프 (최종) 노드를 구별하는 방법

Question

D3.js를 사용하여 사용자가 클러 칭 결과를 볼 수있는 덴도 그램을 생성했습니다. 그러나 디스플레이를 깨끗하게 유지하려면 부모 노드를 최대한 단순하게 유지해야합니다 (텍스트가없고 원이 없음).

이 데이터가 현재 표시되는 방식입니다 : http://i.imgur.com/Cz52Fhl.png

그리고 이것은 내가 그것을 보여 드리고자 방법의 예입니다 (방향이 중요하지 않습니다, 무슨 중요한 것은 내부 노드는 텍스트 또는 원하지 않은 것입니다) : http://i.imgur.com/Oo2A0b7.png

코드 ...

// Compute the new tree layout. 
     var nodes = tree.nodes(root).reverse(), 
      links = tree.links(nodes); 

     // Normalize for fixed-depth. 
     nodes.forEach(function(d) { d.y = d.depth * 130; }); 

     // Update the nodes… 
     var node = svg.selectAll("g.node") 
      .data(nodes, function(d) { return d.id || (d.id = ++i); }); 

     // Enter any new nodes at the parent's previous position. 
     var nodeEnter = node.enter().append("g") 
      .attr("class", "node") 
      .attr("transform", function(d) { return "translate(" + source.y0 + "," + source.x0 + ")"; }) 
      .on("click", click); 

     nodeEnter.append("circle") 
      .attr("r", 1e-6) 
      .style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; }); 

     nodeEnter.append("text") 
      .attr("x", function(d) { return d.children || d._children ? -10 : 10; }) 
      .attr("dy", ".35em") 
      .attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; }) 
      .text(function(d) { return d.canonical; }) 
      .style("fill-opacity", 1e-6); 

Answer 1

어떤 중간에 라벨 없음, 당신이 (맨 오른쪽에있는 사람을) 리프 노드 옆에 레이블을 추가 할 수있는 능력을 좋아하는 것이 그 것이다 마디? 예,이 경우

은 라이브 예입니다 노드가 코드의이 부분에 의해 정의되는 내부 또는 잎 유형이든 http://bl.ocks.org/widged/5150104

.enter().append("svg:g") 
     .attr("class", function(n) { 
      if (n.children) { 
      return "inner node" 
      } else { 
      return "leaf node" 
      } 
     }) 

이후

var endnodes = vis.selectAll('g.leaf.node') 
    .append("svg:text") 
    ... skipping attributes ... 
    .text(function(d) { return d.data.name; });