overlaid column chart
The current stacking options are: null to disable, "normal" to stack by value or "percent".
Another visualization is to overlay the columns (usually requiring the use of transparency).
As a comparison, please see the stacking options offered by Flex:
http://livedocs.adobe.com/flex/3/html/help.html?content=charts_displayingdata_11.html

Overlaid column charts are supported by setting grouping to false: http://api.highcharts.com/highcharts#plotOptions.column.grouping
-
kzoon commented
Thanks for pointing this out!
-
cailie commented
Thank you for implementing this. Very cool.
-
But it does... See http://jsfiddle.net/highcharts/S6435/
-
kzoon commented
Yes. This would be bvery useful for comparing with a 'target' series.
It should work in combination with normat stacking.
See this mockup: http://minus.com/i/OrqLzob3rP6fI would like to influence the relative width of the columns
-
Have you considered setting grouping to false? http://api.highcharts.com/highcharts#plotOptions.column.grouping
-
Alexandre Jobin commented
i'm looking for this feature too. Be able to overlaid 2 series together. Something like this:
plotOptions: {
column: {
stacking: 'overlaid'
}
},
series: [
// first stack
{
data: [29.9, 71.5, 106.4, 129.2, 144.0],
stack: 0
}
// second stack
{
data: [106.4, 129.2, 144.0, 29.9, 71.5],
stack: 1
}, {
data: [148.5, 216.4, 30, 176.0, 135.6],
stack: 1
}] -
Anonymous commented
Thinking about it more, it would be nice to have the ability to control the start date and end date of a column -- so you can control how fat each bar is using a time based x-axis.
But for a series of say 3 different values as in the LayeredBarRenderer(), we could create some sort of scalar so the extra columns in the same series would be relative to the first column.
xAxis: { type: 'datetime' },
plotOptions: {
column: {
scale: {1.0, 0.8, 0.6} //important to control these independently rather than linearly with a single value
}
},series: [{
name: 'Consumption1',
data: [
[Date.UTC(2012, 0, 1), 100, Date.UTC(2012, 0, 1) ],
[Date.UTC(2012, 1, 1), 143, Date.UTC(2012, 1, 29) ],
[Date.UTC(2012, 2, 1), 122, Date.UTC(2012, 2, 31) ], ...name: 'Consumption2',
data: [
[Date.UTC(2012, 0, 1), 200, Date.UTC(2012, 0, 1) ],
[Date.UTC(2012, 1, 1), 243, Date.UTC(2012, 1, 29) ],
[Date.UTC(2012, 2, 1), 222, Date.UTC(2012, 2, 31) ], ...name: 'Consumption3',
data: [
[Date.UTC(2012, 0, 1), 300, Date.UTC(2012, 0, 1) ],
[Date.UTC(2012, 1, 1), 343, Date.UTC(2012, 1, 29) ],
[Date.UTC(2012, 2, 1), 322, Date.UTC(2012, 2, 31) ], ...
}] -
Anonymous commented
Something equivalent to JFreeChart's LayeredBarRenderer()?
-
Jan Hoogeveen commented
Overlaying charts is something I'd really like to see as well.
-
Almar commented
Thank you Torstein, that looks rather nice. It's not the effect I'm after though. Also, like you say, it's bit of trickery. If the number of series changes, than also the groupPadding value has to be adjusted.
At this moment I'm thinking of tinkering with the source code. Maybe you give me some advice?
At line 11119 I added "&& stacking!=='overlay'".
// calculate the bottom y value for stacked series
if (stacking && series.visible && stack && stack[xValue] && stacking!=='overlay') {Now if I choose 'overlay' as the stacking mode, the colums are rendered on top of each other, which is the effect I'm after. It would be even nicer if, optionally, the overlayed columns can get gradationally narrower (bottom one is the widest, subsequent columns are narrower).
Cheers,
Almar -
Charles commented
Yes please! I'm really missing this feature. I would like to show scores against targets -- showing two columns in a group doesn't give us the 'right' look.