Highcharts Demo

author(s): Torstein Hønsi

by Vladyslav Kampov

HTML

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

JavaScript

$(function () {

    var chart = new Highcharts.Chart({
    
        chart: {
            renderTo: 'container',
            zoomType: 'xy'
        },
    
        xAxis: {
            type: 'datetime'
        },
        series: [{
            data: [
                [Date.UTC(2010, 0, 1, 10), 29.9],
                [Date.UTC(2010, 0, 1, 20), 71.5],
                [Date.UTC(2010, 0, 2, 10), 106.4],
                [Date.UTC(2010, 0, 2, 20), 129.2],
                [Date.UTC(2010, 0, 3, 10), 144.0],
                [Date.UTC(2010, 0, 3, 20), 176.0],
                [Date.UTC(2010, 0, 4, 10), 186.0],
                [Date.UTC(2010, 0, 4, 20), 206.0]
             ]
        }]
    
    });
    
        Highcharts.setOptions({                                            // This is for all plots, change Date axis to local timezone
                global : {
                    useUTC : false
                }
            });
    
    var chart2 = new Highcharts.Chart({
    
        chart: {
            renderTo: 'container2',
            zoomType: 'xy'
        },
    
        xAxis: {
            type: 'datetime'
        },
        series: [{
            data: [
                [Date.UTC(2010, 0, 1, 10), 29.9],
                [Date.UTC(2010, 0, 1, 20), 71.5],
                [Date.UTC(2010, 0, 2, 10), 106.4],
                [Date.UTC(2010, 0, 2, 20), 129.2],
                [Date.UTC(2010, 0, 3, 10), 144.0],
                [Date.UTC(2010, 0, 3, 20), 176.0],
                [Date.UTC(2010, 0, 4, 10), 186.0],
                [Date.UTC(2010, 0, 4, 20), 206.0]
             ]
        }]
    
    });
});