我一直在谷歌搜索,但我似乎无法理解这一点。
我的情况是饼图上显示的国家/地区重叠:
这是正在发生的事情的一个例子:
我是 D3
的新手,我正在努力防止文本重叠。有没有我可以添加的文本边距属性,这样我的标签就不会相互重叠?
最佳答案
更新:查看D3 put arc labels in a Pie Chart if there is enough space的答案以获得更全面的解决方案。
我不知道有什么通用的方法可以放置文本元素使其不重叠。
但是,通过旋转标签和缩放图形使它们不重叠,有一个解决您的问题的方法:http://jsfiddle.net/2uT7F/
// Get the angle on the arc and then rotate by -90 degrees
var getAngle = function (d) {
return (180 / Math.PI * (d.startAngle + d.endAngle) / 2 - 90);
};
g.append("text")
.attr("transform", function(d) {
return "translate(" + pos.centroid(d) + ") " +
"rotate(" + getAngle(d) + ")"; })
.attr("dy", 5)
.style("text-anchor", "start")
.text(function(d) { return d.data.label; });
关于javascript - 防止D3饼图中的文本重叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14534024/