Highcharts Demo

author(s): Torstein Hønsi

HTML

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

JavaScript

$(function() {
    function newRandomData(n) {
        // generate an array of random data
        var data = [],
            time = (new Date()).getTime(),
            i;

        for (i = -1 * n; i <= 0; i++) {
            data.push(Math.random() * 10);
        }
        return data;
    }
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'bar'
        },
        plotOptions: {
            bar: {
                stacking: 'normal'
            }
        },
        xAxis: [{
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },{
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
            labels: {
                enabled: false
            },
            left: 0,
            offset: 0   
        },{
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
            labels: {
                enabled: false
            },
            left: 0,
            offset: 0   
        }],
        yAxis: [{
            width: 100
        },{
            width: 100,
            left: 0,
            offset: 0            
        },{
            width: 100,
            left: 0,
            offset: 0   
        }],
        tooltip: {
            shared: true
        },
        series: [{
            data: newRandomData(11)
        },{
            data: newRandomData(11),
            yAxis: 1,
            xAxis: 1
        },{
            data: newRandomData(11),
            yAxis: 2,
            xAxis: 2
        }]
    });
});