Highcharts Demo

author(s): Torstein Hønsi

by koh_edwin

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>

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

CSS

#container {
    height: 400px;
}

JavaScript

Highcharts.setOptions({
    lang: {
        numericSymbols: ["k", "M", "B", "T", "P", "E"]
    }
});

Highcharts.chart('container', {

    xAxis: {
        categories: [
            'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep',
            'Oct', 'Nov', 'Dec'
        ],
        title: {
            text: 'Month'
        }
    },
    /*yAxis: {
        labels: {
            formatter: function() {
                var value = this.value;
                if (value >= 1000000000) {
                    return Highcharts.numberFormat(value / 1000000000, 1) + 'B';
                } else if (value >= 1000000) {
                    return Highcharts.numberFormat(value / 1000000, 1) + 'M';
                } else if (value >= 1000) {
                    return Highcharts.numberFormat(value / 1000, 0) + 'K';
                } else {
                    return value;
                }
            }   
        }
    },
    */
    series: [{
        data: [
            2900000000.9, 7100000000.5, 10600000000.4, 12900000000.2, 14400000000.0, 17600000000.0, 13500000000.6, 14800000000.5, 2160000000.4, 194000000.1,
            950000000.6, 540000000.4
        ]
    }],

    navigation: {
        menuStyle: {
            background: '#E0E0E0'
        }
    }
})