Question

我正在尝试在条形图中添加标签，但我无法使其正常工作。我已经阅读了很多关于它的内容，并尝试了很多东西，但没有成功。

dist

这是我的Plunker.

感谢任何帮助。提前谢谢。

Answer 1

您可以使用下面的代码段为条形添加标签 -

  svg.selectAll(".text")        
  .data(data)
  .enter()
  .append("text")
  .attr("class","label")
  .attr("x", (function(d) { return x(d.date); }  ))
  .attr("y", function(d) { return y(d.value) - 20; })
  .attr("dy", ".75em")
  .text(function(d) { return d.value; });

你的问题在这里。获取标签的x-y位置的正确方法与使用x和y变量的条形图相同。

.attr("x", function(d, i) {
   return i * (width / data.length);
  })
  .attr("y", function(d) {
   return height - (d * 4);
 });

更新了Plunkr - https://plnkr.co/edit/e6HPuph3OSbpxeEVQXfF?p=preview

向条形图D3添加标签

1 个答案: