d3.js - d3js column bar chart height error -
i'm trying replicate this simple column bar chart in d3 except use negative values. able figure out how use negative values, axis seems off. think it's i'm doing y-values.
here's i'm drawing bars:
var chart = d3.select("body").append("svg") .attr("class","chart") .attr("width", w * data.length - 1) .append("g") .attr("height", h); chart.selectall("rect") .data(data) .attr("class","rect") .enter().append("rect") .attr("x", function(d, i) { return x(i) - .5; }) .attr("y", function(d) { return h - y(d.value) - .5; }) .attr("width", w) .attr("height", function(d) { return math.abs(y(d.value) - y(0)); });
and here's fiddle everything: http://jsfiddle.net/y4wac/2/
i want have x-axis @ 0 , bars originating x-axis simple i'm n00b
thanks!
to this, need move line adjusting y
coordinate. in case, easiest done subtracting y(0)
height
, i.e.
.attr("y1", h - y(0)) .attr("y2", h - y(0))
updated jsfiddle here.
Comments
Post a Comment