D3.js에서 강제 지시 그래프의 줄에 텍스트를 추가하고 그 텍스트를 렌더링하려면 어떻게해야합니까?

Question

D3.js에서 force.layout 기능을 사용하는 방법을 배우려하고 "Force Directed Radial Graph"을 구축하고 있습니다.

노드 (예 : 노드 이름)에서 텍스트를 성공적으로 추가하고 렌더링 할 수는 있지만 행 (또는 다른 사람들이 링크 또는 가장자리라고 부를 수있는 텍스트)에서 렌더링 할 수없는 것처럼 보입니다 (예 : 관계 이름).

아무에게도 그렇게하는 법을 가르치는 좋은 예를 어디에서 찾을 수 있는지 또는 내가 한 것을 교정 할 수있는 코드 스 니펫을 가지고 있는지 알 수 있습니까?

도움을 주셔서 감사합니다. 크게 감사드립니다.

최선을,

프랭크

Answer 1

샘플은 이미 가장자리에 텍스트를 추가하는 방법을 보여줍니다.

 // Append text to Link edges 
    var linkText = svgCanvas.selectAll(".gLink") 
     .data(force.links()) 
    .append("text") 
    .attr("font-family", "Arial, Helvetica, sans-serif") 
    .attr("x", function(d) { 
     if (d.target.x > d.source.x) { return (d.source.x + (d.target.x - d.source.x)/2); } 
     else { return (d.target.x + (d.source.x - d.target.x)/2); } 
    }) 
     .attr("y", function(d) { 
     if (d.target.y > d.source.y) { return (d.source.y + (d.target.y - d.source.y)/2); } 
     else { return (d.target.y + (d.source.y - d.target.y)/2); } 
    }) 
    .attr("fill", "Maroon") 
     .style("font", "normal 12px Arial") 
     .attr("dy", ".35em") 
     .text(function(d) { return d.linkName; });