Highcharts Demo

author(s): Torstein Hønsi

by Torstein Hønsi

HTML

<script src="http://github.highcharts.com/bf7009e0/highcharts.js"></script>

<script src="http://momentjs.com/downloads/moment.min.js"></script>
<script src="http://momentjs.com/downloads/moment-timezone-with-data-2010-2020.min.js"></script>

<div id="container" style="height: 400px; width: 800px"></div>

JavaScript

$(function () {
    
    Highcharts.setOptions({
        global: {
            /**
             * Use moment-timezone.js to return the timezone offset for individual 
             * timestamps, used in the X axis labels and the tooltip header.
             */
            getTimezoneOffset: function (timestamp) {
                var zone = 'Europe/Oslo',
                    timezoneOffset = moment.tz.zone(zone).parse(timestamp);
                
                return timezoneOffset;
            }
        }
    });
    
    $('#container').highcharts({

        title: {
            text: 'getTimezoneOffset with local DST crossover'
        },
        
        subtitle: {
            text: 'From October 27, UTC midnight is 01:00 AM in Oslo'
        },

        xAxis: {
            type: 'datetime'
        },

        series: [{
            data: (function () {
                var arr = [];
                for (var i = 0; i < 16; i++) {
                    arr.push(i);
                }
                return arr;
            }()),
            dataLabels: {
                enabled: true,
                format: '{x:%H:%M}'
            },
            pointStart: Date.UTC(2014, 9, 15), 
            pointInterval: 24 * 36e5,
            name: 'UTC Midnight'
        }]
    });
});