Javascript examples for highcharts:Chart Configuration
Formatting the date with correct month
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script type="text/javascript"> $(function () {/*from w ww . ja v a 2 s .c om*/ function subtractMonth(a) { var date = new Date(a[0]), month = date.getMonth(); date.setMonth(month - 1); return [date.getTime(), a[1]]; } function sorter(a, b) { return a[0] - b[0]; } var data = [{ name: 'Hyderabad', data: [ [Date.UTC(2013, 05, 01), 311328], [Date.UTC(2013, 05, 02), 363780], [Date.UTC(2013, 04, 03), 364062], [Date.UTC(2013, 04, 04), 283128], [Date.UTC(2013, 04, 05), 322608] ] }, { name: 'Vijayawada', data: [ [Date.UTC(2013, 06, 01), 363216], [Date.UTC(2013, 06, 02), 404670], [Date.UTC(2013, 06, 03), 370783], [Date.UTC(2013, 06, 04), 459942], [Date.UTC(2013, 07, 05), 569499] ] }]; $.each(data, function (i, s) { s.data = s.data.map(subtractMonth); s.data.sort(sorter); }) $('#container').highcharts({ chart: { type: 'column' }, xAxis: { type: 'datetime' }, series: data }); }); </script> </head> <body> <script src="https://code.highcharts.com/highcharts.js"></script> <script src="https://code.highcharts.com/modules/exporting.js"></script> <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div> </body> </html>