javascript - What the right way to graph negative numbers in Protovis? -
for simplest use case, bar chart values ranging -10 10, how 1 go coding cleanly using protovis javascript charting library?
by cleanly mean centering axis, showing x , y axis labels, , representing column values of chart negative values fall below y axis , positive values exceed y axis.
here's working example: http://jsfiddle.net/nrabinowitz/yk5by/3/
the important parts of follows:
make x-axis scale going min value max value (in case,
pv.scale.linear(-10,10).range(0,w)
; in example, calculate min , max based on data).base width of bar on absolute distance of datum 0:
.width(function(d) { return math.abs(x(d) - x(0)); })
then adjust
.left()
property based on whether datum positive or negative:.left(function(d) { return d > 0 ? x(0) : x(0) - this.width(); });
because we're using simple x-axis scale, adding axis labels super-easy:
vis.add(pv.label) .data(x.ticks()) // use pv.range(min, max, 1) here .left(x);
Comments
Post a Comment