javascript - Show gaps (diff) between a bar and a line -
is possible draw gaps between different chart types? in example (picture below) have bars , line in same chart. gap difference of line-value , bar-value below. furthermore, if bar above line, should green gap, else red one.
it's possible draw "normal" gap-bar bottom line behind actual bar, work red gaps , not green ones?
here's example image: http://i.imgur.com/ruvjxa2.png
what showing 4 different data series. blue bar series, black line series, green bar "below" series , red bar "above" series.
given have line , bar series this:
var databar = [[0,23],[1,34],[2,45],[3,21]]; var dataline = [[0,13],[1,53],[2,23],[3,90]];
you can create other 2 series like:
var diffabove = []; var diffbelow = []; (var j = 0; j < 10; j++) { if (dataline[j][1] > databar[j][2]) { diffabove.push([j, dataline[j][3], databar[j][4]]); } else { diffbelow.push([j, databar[j][5], dataline[j][6]]); } }
and put using array of series objects:
var dataseries = [{ color: 'blue', data: databar, lines: { show: false }, bars: { show: true, align: 'center', barwidth: 0.8 } }, { color: 'black', data: dataline, lines: { show: true }, bars: { show: false } }, { color: 'red', data: diffabove, lines: { show: false }, bars: { show: true, barwidth: 0.5, align: 'center' } }, { color: 'green', data: diffbelow, lines: { show: false }, bars: { show: true, barwidth: 0.5, align: 'center' } } ];
this produces (example here):
Comments
Post a Comment