Highcharts, multi stacked bar with shared legend items

Question

I've this set of data that is

                            Serie 1    Serie 2
Category 1     2005         20         10              
               2006         30         15
Category 2     2005         35         17
               2006         25         12

See this fiddle: http://jsfiddle.net/X4g4Q/

I've checked options like giving the series ids and things like linkedTo http://api.highcharts.com/highcharts#plotOptions.bar.linkedTo

But I've found not a single way in which I can have multiple stacked bars that 'share' a legend item (thus color). Am I formatting my data incorrectly or is this simply not possible using highcharts?

Answer 1

linkedTo options allows you to have one legend item for n-series. It's not about series colors. If you want to use the same color, set it directly for series, see: http://jsfiddle.net/6bgvz/

var colors = Highcharts.getOptions().colors; // get colors

// in options:

series: [{ 
    color: colors[0]
}, { 
    colors: colors[1]
} ... ]

Answer 2

You can hide two series in the legend (which are the same name), catch legendItemClick and combine show/hide action.

events:{
                legendItemClick:function(){
                    var name = this.name,
                        series = this.chart.series;

                    $.each(series, function(i,serie){
                        if(serie.name == name) {
                            if(serie.visible)
                                serie.hide();
                            else
                                serie.show();
                        }
                    });

                    return false;
                }
            },

http://jsfiddle.net/X4g4Q/3/

Answer 3

Maybe with linkedTo:':previous', . Look at this fiddle