javascript - Grouped bar chart "in one line" with D3.js -
i'm trying make particular bar chart d3.js, , don't find example match. code bar chart 2 series (one negative, , 1 positive) disposed on same line, not stacked.
i guess maybe it's not clear, i've made on highcharts. want use d3 connect chart map did before.
so, know example me? can sort directly chart if series unordered? , if 2 series punctually postive, little 1 appear in front of largest?
the trick order data, in order so, can use [d3.ascending()][1]
functions:
with following example data:
data = [{ name: "a", valueright: 1, valueleft: 2 }, { name: "b", valueright: 4, valueleft: 5 }, ...]
we have:
function leftbound(node) { return d3.max([node.valueleft,-node.valueright]) } function rightbound(node) { return d3.max([node.valueright,-node.valueleft]) } datasort = function(a,b) { res = d3.descending(leftbound(a),leftbound(b)) if(res==0) { return d3.descending(rightbound(a),rightbound(b)) } else { return res } }
for reusable charts, can use [selection.sort()][2]
have 2 bar categories.
jsfiddle: http://jsfiddle.net/vgz6e/55/
screenshot:
the original code following question: d3.js bar chart pos & neg bars (win/loss) each record
Comments
Post a Comment