javascript - 将硬编码固定线添加到 d3 条形图

Question

希望你能帮助我解决这个问题，它几乎是一个相同的问题(这似乎并不完整，因为没有行显示):

d3.js How to add lines to a bar chart

不同之处在于我需要创建一个硬编码引用线，例如 7%。

我尝试在这里创建 fiddle ，但无法显示该行。

http://jsfiddle.net/ComputerSaysNo/sstSe/1/

我想这可以通过改变这个来完成......？

bars.append("行") .attr("x1", 0) .attr("y1", function(d,i) { 返回高度 - d.average; }) .attr("x2", 10) .attr("y2", function(d,i) { 返回高度 - d.average; });

非常感谢，

瑞安。

Answer 1

您要将这一行附加到您的 bars 变量中，该变量是条形图的选择。您需要将这一行附加到 SVG:

svg.append("line")
  .style("stroke", "black")
  .attr("x1", 0)
  .attr("y1", y(0.07))
  .attr("x2", width)
  .attr("y2", y(0.07));

这也可以正确设置坐标。请记住，您没有数据绑定(bind)到该行，因此 function(d) { ... } 将不起作用。

完整演示 here 。我还删除了一堆不必要的和损坏的代码。