Javascript D3JS中不在圆圈中间显示的文本

下面的代码在d3js中打包了圆圈

csjson={
“儿童”：[{
“名称”：“肮脏精灵”，
“计数”：8833
}, {
“名称”：“线条精灵”，
“计数”：1732
}]
};
var直径=200；
var pack=d3.layout.pack（）.size（[diameter-4，diameter-4]）.padding（2）.sort（函数（a，b）{
返回Math.random（）；
}).价值（功能（d）{
返回d.count；
});
var svg=d3.select（“body”）.append（“svg”）.attr（“width”，diameter）.attr（“height”，diameter）；
var vis=svg.datum（（csjson））.selectAll（“.node”）.data（pack.nodes）.enter（）.append（“g”）；
var titles=相对附加（“title”）
.attr（“x”，函数（d）{
返回d.x；
}).attr（“y”，函数（d）{
返回d.y；
}).文本（功能（d）{
返回d.children？”：（d.name+“”+d.count）；
});
变量圆=可视附加（“圆”）
.attr（“笔划”、“黑色”）
.样式（“填充”，功能（d）{
返回！d.儿童？“谭”：“米色”；
})
.attr（“cx”，功能（d）{
返回d.x；
})
.attr（“cy”，函数（d）{
返回d.y；
})
.attr（“r”，函数（d）{
返回d.r；
});
var textLabels=vis.filter（函数（d）{
返回！d.儿童；
}).append（“文本”）.style（“文本锚定”、“中间”）
.文本（功能（d）{
返回d.name.substring（0，d.r/3）；
});
问题在于没有将x和y值设置为文本DOM

与此相反：

var textLabels = vis.filter(function(d) {
    return !d.children;
}).append("text").style("text-anchor", "middle")
  .text(function(d) {
    return d.name.substring(0, d.r / 3);
});

一定是这样

var textLabels = vis.filter(function(d) {
    return !d.children;
  }).append("text").style("text-anchor", "middle") .attr("x", function(d) {
    return d.x;
  }).attr("y", function(d) {
    return d.y;
  })
  .text(function(d) {
    return d.name.substring(0, d.r / 3);
  });

工作小提琴
您必须将x和y位置设置为文本：

var textLabels = vis.filter(function(d) {
    return !d.children;
}).append("text").style("text-anchor", "middle")
.attr("x", function(d) {
    return d.x;
}).attr("y", function(d) {
    return d.y;
}).text(function(d) {
    return d.name.substring(0, d.r / 3);
});

这只是一般原则，您可能需要根据需要调整x和y。
谢谢。现在这个问题似乎很愚蠢！：）