D3 햇살 다이어그램 중앙에 텍스트를 추가하는 방법

Question

zoomable sunburst example을 사용하고 있지만 다이어그램 중앙에 텍스트를 추가하고 확대/축소 할 수있게하는 데 어려움을 겪고 있습니다. 아이디어는 길이를 나타내는 특정 호를 클릭하면 가운데 텍스트가 변경된다는 것입니다. mouseclick 및 mouseover의 속성이 사라지는 것으로 보입니다. 이 내가 시도 것입니다 :

path.append("svg:text") 
     .on("click",click) 
     .style("font-size","4em") 
     .style("font-weight","bold") 
     .text(function(d) { return count_function(data); }); 

누군가가 나를 클릭 기능을 잃지 않고 차트의 일 중심에있는 텍스트를 표시하는 방법을 이해하는 데 도움이

?

원형 중심을 나타내는 "g"를 선택하고 차트가 표시되면 텍스트를 추가하는 것이 더 쉬운 방법 일 수 있습니다. 나는 이것을 시도했지만 successfylly이 요소를 선택하는 것은 불가능하다. (미안, 나는 D3에 익숙하지 않다.) 다시 사각형으로 돌아 간다.

Answer 1

path 요소 안에 text 요소를 삽입하려는 것 같습니다. 다음과 같이 시도해보십시오.

svg.select("g").append("svg:text") 
    .on("click",click) 
    .style("font-size","4em") 
    .style("font-weight","bold") 
    .text(function(d) { return count_function(data); });