Highcharts Demo

author(s): Torstein Hønsi

by Guillaume Seguin

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container"></div>

CSS

#container {
    max-width: 800px;
    height: 400px;
    margin: 1em auto;
}

JavaScript

Highcharts.chart('container', {
    chart: {
        //alignThresholds: true,
        type: 'column'
    },
    title: {
        text: 'The <em>alignThreshold</em> option is true'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May']
    },
    yAxis: [{
        title: {
            text: 'Primary Axis'
        },
        plotLines: [{
            value: 0,
            width: 2,
            zIndex: 1
        }],
        gridLineWidth: 0
    }, {
        title: {
            text: 'Secondary Axis'
        },
        opposite: true
    }],
    series: [{
        data: [-5, -11, -1, 2, 0],
        yAxis: 0
    }, {
        data: [1000, 1001, 1002, 1004, 1003],
        yAxis: 1
    }]
});