ElementStacks

HTML

<script src="http://highcharts.com/js/testing.js"></script>
<div id="container" style="height: 400px"></div>

JavaScript

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        defaultSeriesType: 'column'
    },
    xAxis: {
        categories: ['2009', '2010', '2011']
    },
    plotOptions:{
        series:{
            stacking:'normal'
        }
    },
    tooltip: {
        formatter: function() {
            var series = this.series.chart.series, 
                stackKey = this.series.stackKey,
                str = this.series.options.stack+'<br/>',
                x = this.point.x;

            for(i=0; i<series.length; i++)
            {
                console.log(series[i].stackKey, stackKey)
                if( series[i].stackKey == stackKey )
                    str += series[i].name+': '+series[i].data[x].y+'<br/>';
            }
            return str;
        }
    
    },
    
    series: [{
        name:'apples',
        stack:'John',
        data: [10, 10, 10]},{
        name:'oranges',
        stack:'John',
        data: [10, 10 ,10]}, {
        name:'pears',
        stack:'John',
        data: [10, 10 ,10]},{
            
        name:'apples',
        stack:'Alan',
        data: [15,15,15]},{
        name:'oranges',
        stack:'Alan',
        data: [15,15,15]},{
        name:'pears',
        stack:'Alan',
        data: [15,15,15]},{
             
        name:'apples',
        stack:'David',
        data: [8,8,8]},{
        name:'oranges',
        stack:'David',
        data: [8,8,8]}, {
        name:'pears',
        stack:'David',
         data: [10,8,8]},   

         
    
    
    ]
});