D3.js 如何将文本添加到D3 sunburst图表的中心

D3.js 如何将文本添加到D3 sunburst图表的中心,d3.js,sunburst-diagram,D3.js,Sunburst Diagram,我正在使用,但我正在努力尝试将文本添加到图表的中心,并且仍然使其可缩放。 这个想法是,当我点击一个指示其长度的弧时,中间的文本将发生变化。似乎鼠标单击和鼠标悬停的特性消失了。 这就是我尝试过的: path.append("svg:text") .on("click",click) .style("font-size","4em") .style("font-weight","bold") .text(function(d) { re

我正在使用,但我正在努力尝试将文本添加到图表的中心,并且仍然使其可缩放。 这个想法是,当我点击一个指示其长度的弧时,中间的文本将发生变化。似乎鼠标单击和鼠标悬停的特性消失了。 这就是我尝试过的:

path.append("svg:text")
        .on("click",click)
        .style("font-size","4em")
        .style("font-weight","bold")
        .text(function(d) { return count_function(data); });
有人能帮助我理解如何在不丢失单击功能的情况下在图表的中心显示文本吗


也许更简单的方法是选择代表圆心的“g”,并在图表显示后向其添加文本。我已经尝试过了,但无法成功地仅选择此元素(很抱歉,我是D3新手),因此请返回第一步。

看起来您正在尝试在
路径
元素中插入
文本
元素。试着这样做:

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

非常感谢Richard!然而,它仍然不起作用。当第一个圆圈被填满时,我可以看到文本一秒钟。这只是猜测,但是文本是先声明的吗?SVG中没有z索引,因此元素的附加顺序会影响哪些元素可以被看到。如果我按照您的建议,在创建svg后将文本附加到“g”元素,我已经成功地使其可见。但是,当我进行转换时,我丢失了文本。您能在JSFIDLE上放置一个带有转换问题的工作副本吗?我很难在看不到的情况下说出问题所在。代码来自以下示例:。转换在函数animate()中