[Answer]-High chart graph doesnt start from the correct month

by

1👍

✅

Define your categories in the xAxis

 xAxis: {
            categories: [
                'Jan',
                'Feb',
                'Mar',
                'Apr',
                'May',
                'Jun',
                'Jul',
                'Aug',
                'Sep',
                'Oct',
                'Nov',
                'Dec'
            ]
        }

Use index of the month (base 0) instead of the month literal in your series’ data (should be easy to do, either on the server or JS)

 series: [{
             name: 'Consommations',
            data: normalizeData([[1,5],[9,10],[5,0]])

        }, {
            name: 'Prévisions',
            data: normalizeData([[1,2],[2,4],[5,8]])

        }]

Normalize your data with javascript to add data for missing months

function normalizeData(data){
  var normalizedData=[];
  var i;
  for(i=0;i<12;i++){
    if(data[i])
        normalizedData[i]=data[i];
    else
        normalizedData[i]=0;
  }
  return normalizedData;
}

jsFiddle solution: http://jsfiddle.net/jugal/zDnS2/

Alternate solution
Add the missing month data in the normalizeData method
just create the months array to represent the possible months

var months=[
                'Jan',
                'Feb',
                'Mar',
                'Apr',
                'May',
                'Jun',
                'Jul',
                'Aug',
                'Sep',
                'Oct',
                'Nov',
                'Dec'
            ];

and add data as 0 where data is not present

function normalizeData(data){
var existingMonths=[];
var normalizedData=[];
var i;
for(i=0;i<data.length;i++){
    var datum=data[i];
    datum[0]=  $.inArray(datum[0],months);
    existingMonths.push(datum[0]);
    normalizedData.push(datum);
}
for(i=0;i< months.length;i++){
    if($.inArray(i,existingMonths)==-1)
        normalizedData.push([i ,0]);
}
return normalizedData;
}

set xAxis categories to the months array

 xAxis: {
            categories: months
        }

@ http://jsfiddle.net/jugal/vYK7H/

👤Jugal Thakkar

Leave a comment