Question

我有两个问题。

我想将数据标签添加到堆积条形图中我尝试更改此示例的代码StackedBarChart，但我无法添加数据标签。
如果添加标签，我需要防止重叠。我希望我可以像John Williams在他的博客中找到饼图www.safaribooksonline.com/blog/2014/03/11/solving-d3-label-placement-constraint-relaxing/或者d3扩展名D3-Labeler //tinker10.github.io/D3-Labeler/。

我找到了这个jsfiddle http://jsfiddle.net/3a5Wk/1/代码，如果您也可以将答案放在jsfiddle中或者更详细地解释您的代码，我将非常感激，因为我刚开始使用d3-Charts。

Answer 1

我通过添加标签代码解决了第一个问题的问题。我添加了：

var dataText = svg.selectAll(".dtext")  

.data(layers)
.enter().append("g")
 .attr("class", "g")


 dataText.selectAll("rect")
  .data(function(d) { return d; })
  .enter().append("text")
  .attr("x", function(d) { return x(d.x) +18; })
  .attr("y", function(d) { return y(d.y + d.y0) +10; })
  .style("text-anchor", "middle")
  .style("font-size", "10px")
  .style("color", "white")
  .text(function (d) {return (d.y);});

现在我仍然遇到标签重叠的问题如何以不重叠的方式更改标签的位置？

D3堆积条形图添加数据标签并解决D3标签放置

1 个答案: