Highcharts Demo

author(s): Torstein Hønsi

by WOUNDEDStevenJones

HTML

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

JavaScript

$(function () {
    //used in tooltip formatter to display date range
    var rangeStart0 = {
        1386828000000: 1333256400000,
        1386828000000: 1357020000000,
        1397710800000: 1357020000000
    };
    var rangeEnd0 = {
        1386828000000: 1364706000000,
        1386828000000: 1364706000000,
        1397710800000: 1372568400000
    };
    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: null
        },
        marginBottom: 25,
        xAxis: {
            type: 'datetime',
            lineColor: '#000000',
            lineWidth: 2,
            tickPositions: [1386828000000, 1397710800000],
            labels: {
                formatter: function () {
                    var myDate = new Date(this.value);
                    var newDateMs = Date.UTC(myDate.getUTCFullYear(), myDate.getUTCMonth(), myDate.getUTCDate());
                    return Highcharts.dateFormat('%m/%Y', newDateMs);
                },
                style: {
                    fontWeight: 'bold',
                    color: '#000000'
                }
            },
            title: {
                text: 'Data release date',
                style: {
                    color: 'black',
                    fontWeight: 'normal',
                    fontSize: '16px'
                }
            }
        },
        yAxis: {
            title: {
                text: null
            },
            labels: {
                format: '{value} %',
                step: 1,
                style: {
                    fontWeight: 'bold',
                    color: '#000000'
                }
            },
            allowDecimals: false,
            endOnTick: false,
            lineColor: '#000000',
            lineWidth: 2,
            gridLineColor: null,
            /*min: 0,*/
            minorGridLineWidth: 0,
            minorTickInterval: 2,
            minorTickColor: '#000000',
           ...