CODEWITHSUNDEEP
highcharts
Yoann Augen
Yoann Augen

Reputation: 2036

Highchart - xAxis weekly date can start any day?

I have a very basic 'line' weekly date graphic. I just need the date on x-axis start the same day of my first point, but actually it's start the monday of the corresponding week. I find a startOfWeek option on the doc, but just take two values : 0 = Sunday, 1 = Monday

For example, with this example, I want the legend start at the 'pointStart' date : 2012, 25 December (Tuesday) But legend start the 24, because it's Monday...

 $('#container').highcharts({
    chart: {
        type: 'line'
    },
    credits : {
      enabled : false
    },
    title: {
        text: false
    },
    xAxis: {  
        tickInterval:  7 * 24 * 3600 * 1000,
        type: 'datetime',
            startOnTick: true,
        labels: {
            format: '{value:%d/%m/%Y}',
            rotation: -45,
            y: 30,
            align: 'center'
        } 
    },
    yAxis: {
        min: 0,
        title: {
            text: 'HH'
        }
    },
    plotOptions: {
        series: {
            pointStart: Date.UTC(2012, 11, 25),
            pointInterval: 7 * 24 * 3600 * 1000
        }
    }, 
    series: [
        {
            name: 'Curva Tardía',
            data: [18, 27, 36, 36]
        }, {
            name: 'Curva Temprana',
            data: [9, 18, 27, 27]
        },{
            name: 'Curva Real',
            data: [0, 36, 45] 
        }
    ]
});

http://jsfiddle.net/MgJux/3/

Do you have any idea how to disable this behavior ?

Thanks

Upvotes: 3

Views: 5838

Answers (1)

Pierre Fourgeaud
Pierre Fourgeaud

Reputation: 14530

Just try to put startOfWeek at 2 :

...
xAxis: {
    startOnTick: true,
    startOfWeek: 2,
    ...
},

Let's see your updated example : http://jsfiddle.net/MgJux/4/

EDIT :

To have the number of the day in function of the date, you can use the Date object in javascript :

var d = new Date(2012, 11, 25)

// ...

...
xAxis: {
    startOnTick: true,
    startOfWeek: d.getDay(),
    //           ^^^^^^^^^^
    ...
},

Upvotes: 4

Related Questions