Highcharts Demo

author(s): Torstein Hønsi

by Nhi Nguyen

HTML

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

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

CSS

body {
    font-family: Arial, Verdana, sans-serif;
}

JavaScript

Highcharts.chart('container', {
    title: {
        text: 'Step line types, with null values in the series'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    series: [{
        data: [1, 2, 3, 4, null, 6, 7, null, 9],
         
        name: 'Right',
        
       zoneAxis:'x',
        zones: [{
            value: 1,
            color: 'green'
        }, {
            value: 2,
            color: 'yellow'
        }, {
            color: 'red'
        }]
    }, {
        data: [5, 6, 7, 8, null, 10, 11, null, 13],
        step: 'center',
        name: 'Center'
    }, {
        data: [9, 10, 11, 12, null, 14, 15, null, 17],
        step: 'left',
        name: 'Left'
    }]

});