我知道这是基本的 d3,但我在将水平图例标签的文本附加到各自的圆圈时遇到问题,这样每个圆圈及其文本标签之间就有统一的空间。
这是一个笨蛋:http://plnkr.co/edit/g1Mt62XcIylzGb4RRnop?p=preview
以下是一些有问题的代码:
li.selectAll("text")
.data(items,function(d) { return d.key})
.call(function(d) { d.enter().append("text")})
.call(function(d) { d.exit().remove()})
.attr("x",function(d,i) { return 12+i*75})
.attr("y","0.39em")
.text(function(d) { ;return d.key})
li.selectAll("circle")
.data(items,function(d) { return d.key})
.call(function(d) { d.enter().append("circle")})
.call(function(d) { d.exit().remove()})
.attr("cx",function(d,i) { return i*7.1+"em"})
.attr("cy",0)
.attr("r","0.4em")
.style("fill",function(d) { console.log(d.value.color);return d.value.color})
最佳答案
不确定这是否有帮助,但我的代码位于 https://steeplechasers.org/membership/membership-statistics/正在做类似类型的传奇。
参见https://steeplechasers.org/wp-content/themes/steeps/js/membership-stats.js并搜索图例以了解这是如何完成的。
通常我会放入获得此示例的代码中,因为我自己并没有弄清楚。我希望这次我能这么做,这样我就可以引用原著了。不幸的是,在这种情况下我没有添加引用。
关于javascript - 如何将文本标签附加到水平图例中各自的圆圈?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47044905/