d3.js - 如何将文本添加到 D3 旭日形图的中心

Question

我正在使用可缩放的旭日形首饰示例，但我正在努力尝试将文本添加到图表的中心并使其仍可缩放。这个想法是，当我单击指示其长度的某个弧时，中心的文本会发生变化。似乎 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”，并在图表显示后向其添加文本。我已经尝试过了，但我无法成功地选择这个元素（对不起，我是 D3 的新手），所以回到第一格。

Answer 1

看起来您正试图在元素中插入一个text元素path。尝试这样的事情：

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