Highcharts area range chart with point objects

by supertrue

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

JavaScript

jQuery(function ($) {

$('#container').highcharts({

    chart: {
        type: 'arearange'
    },

    series: [{
        name: 'My series',
        data: [
            {x: 1, low: 3, high: 5},
            {x: 2, low: 3, high: 4},
            {x: 3, low: 2, high: 6, name: 'Custom point name'},
            {x: 4, low: 4, high: 7}

            // Array data format from HighCharts demo
            //[1, -5.8, 0.1],
            //[2, -4.1, 1.4],
            //[3, -0.5, 4.1],
            //[4, -8.9, -0.7]
        ]
    }]

});

});