d3js (v4) 노드에 텍스트가있는 캔바스 강제 레이아웃

Question

나는 아주 기본적인 질문이 있습니다. https://bl.ocks.org/mbostock/ad70335eeef6d167bc36fd3c04378048을 재현하려고하지만 각 노드에 텍스트를 추가하기 만하면됩니다. svg로이 작업을 수행 할 수 있지만 효율적인 렌더링을 위해 캔버스 버전을 사용하고 싶습니다.

고마워요.

Answer 1

대답은 다음과 같이 drawNode 기능을 수정하는 것입니다 :

function drawNode(d) { 
    context.moveTo(d.x + 3, d.y); 
    context.arc(d.x, d.y, 5, 0, 2 * Math.PI); 
    context.fillText(d.name, d.x+10, d.y+3); 
} 

context.fillText() 캔버스에 텍스트를 추가 할 수 있습니다.