Highcharts series graph to start and end on tick and end on max

Question

I want a highcharts graph, to start and end on tick, and have the final x limit equal to the max value.

Even though my configuration has:

    max: 11,
    endOnTick: true

I found that the actual final value of the graph is 12. How do I make it to be 11 without having to change endOnTick to false?

Example:

http://jsfiddle.net/5VVMm/

Thanks in advance.

Answer 1

Easiest way is to use predefined tickInterval, following will do:

xAxis: {
    min: 0,
    step: 2,
    max: 11,
    startOnTick: true,
    endOnTick: true,
    tickInterval: 1
}

A little bit trickier is tickPixelInterval usage, in your case 50 will do.

Things become even more complicated, if your chart is scalable/zoomable. You'll have to write custom event handler to update those properties, to ensure that your tickInterval is diveder to your data range (if it's even possible, i.e. data range is integer, not float) to ensure that your last tick equals max axis value.