CODEWITHSUNDEEP
javascripthighcharts
Szilveszter Safar
Szilveszter Safar

Reputation: 379

Highstock doesn't support custom (3 days) tickInterval with formatting

I'm using HighStock to display timeseries data and I want to allow the users to pre-define the label interval on the x-axis. If I try to set it to 3 days, it snaps to 2 days, or if I set it to 5 days it snaps up to 7 days. 

xAxis: {
    // This should equal to 3 days.
    tickInterval: 3*24*3600*1000,
    ordinal: false
},

See: http://jsfiddle.net/DH664/1/

I understand that this is the default behavior, so I tried to provide my own tickPositioner function. It actually worked, but I was surprised that the date formatting of the labels was gone. 

xAxis: {
    tickPositioner: function (min, max) {
        var res = [],
            i = (((min + interval -1) / interval) >> 0) * interval;
        for (; i <= max; i+= interval) {
            res.push(i);
        }
        return res;
    },
    ordinal: false
},

See: http://jsfiddle.net/DH664/2/

I found this workaround: tickInterval doesn't work properly in Highchart and Highstock.

This lets me define a custom interval I can later set, but only before instantiating the chart. What if I want two charts with different user-specified intervals that I don't know beforehand?

Is there a proper solution to have any custom interval and still get the formatting?

Thanks

Upvotes: 0

Views: 342

Answers (2)

Szilveszter Safar
Szilveszter Safar

Reputation: 379

Ok, I've found a solution that works for me. I have to inject the custom time interval into the default units array if it's not already there. The trick is that the axis config allows a units property which expects something like this config, but it is not documented.

Hope this helps others.

Upvotes: 0

Paweł Fus
Paweł Fus

Reputation: 45079

Use chart.xAxis.update({tickInterval: x}); to update interval. But the reason, why this happen, is probably minRange: http://api.highcharts.com/highcharts#xAxis.minRange

Upvotes: 1

Related Questions