Stacked percentage column

author(s): Torstein Hønsi

by Guillaume Seguin

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<script src="https://code.highcharts.com/modules/accessibility.js"></script>

<figure class="highcharts-figure">
    <div id="container"></div>
</figure>

CSS

#container {
    height: 400px;
}

JavaScript

Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    title: {
        text: null,
    },
    "plotOptions": {
        "column": {
            "groupPadding": 0,
            "pointPadding": 0,
            "threshold": null
        }
    },
    "xAxis": {
        "visible": false
    },
    series: [{
    		id: '1',
        name: 'Biens concurrents',
        legendIndex: 0,
        data: [777]
    }, {
    		id: '2',
        legendIndex: 0,
        data: [900],
        linkedTo: '1'
    }, {
    		id: '3',
        legendIndex: 0,
        data: [930],
        linkedTo: '1'
    }, {
    		id: '4',
        name: 'Votre bien',
        legendIndex: 1,
        data: [1000]
    }, {
    		id: '5',
        legendIndex: 0,
        data: [1300],
        linkedTo: '1'
    }, {
    		id: '6',
        legendIndex: 0,
        data: [1320],
        linkedTo: '1'
    }, {
    		id: '7',
        legendIndex: 0,
        data: [1400],
        linkedTo: '1'
    }]
});