Skip to content Skip to sidebar Skip to footer

Draw Horizontal Lines For Bars In Nvd3 Multi Bar Chart

I want to draw 2 horizontal lines for each of the bars in this nvd3 multibar chart Here is the fiddle I have few queries Why is yValueScale(0) not starting from 0 of the plot How

Solution 1:

You are appending the line to the wrong "container". The svg variable is the entire svg container, nvd3's drawing container, though, is the g element:

<g class="nvd3 nv-wrap nv-multibar" transform="translate(0,0)">

So, use:

var g = d3.select("#chart1 svg .nvd3");
g.append("line")
  .style("stroke", "#FF7F0E")
  .style("stroke-width", "2.5px")
  .attr("x1", xValueScale("A"))
  .attr("y1", yValueScale(yValue))
  .attr("x2", xValueScale("A") + 100)
  .attr("y2", yValueScale(yValue));

Updated fiddle.

Post a Comment for "Draw Horizontal Lines For Bars In Nvd3 Multi Bar Chart"