[Solved]-d3.js water bar chart-d3.js

Here's the working JSFiddle: http://jsfiddle.net/NYEaX/1860/

Where you were appending the horizontal lines, you were using barWidth - 100/(i+1); to determine the x-axis. This would have worked if barWidth was actually the width of each bar, (but it had been set to 150 instead?)

     .attr("x1", function(d, i) {
        return (i * 30);

Each bar has a width of 20 and a margin of 5 on each side. So to calculate the offset, just multipy the bar number, i by with total width of the bar, 30.