Adding text to the center of a D3 Donut Graph

后端 未结 1 1400
失恋的感觉
失恋的感觉 2021-01-12 01:00

Fiddle

I am trying to insert basically a label to the center of a donut graph using D3. I was able to work with an existing code I found and manipulate it so all the

相关标签:
1条回答
  • 2021-01-12 01:24

    You can simplify your code quite a bit. Since you are already centering the pie chart:

    var svg = d3.select("#svgContent").append("svg")
        .attr("width",width)
        .attr("height",height)
        .append("g")
        .attr("transform","translate("+width/2+","+height/2+")");
    

    You can just add the text as follows:

    svg.append("text")
       .attr("text-anchor", "middle")
       .text("$" + totalValue);
    

    Note that since you are only adding one <text>, you don't need to bind any data to it, and can pass .text(...) a value directly instead of a function.

    0 讨论(0)
提交回复
热议问题