yAxis tickinterval in highcharts is not working as per the value

Question

Currently i am working on radar chart in highcharts. so when providing the tickInterval value in yAxis is not plotting as per the given value. I mentioned the bug exactly in commenting. please refer it. and here is my fiddle

$(function () {
    $('#container').highcharts({
        chart: {
            polar: true
        },
        title: {
            text: 'Highcharts Polar Chart'
        },
        pane: {
            startAngle: 0,
            endAngle: 360
        },
        xAxis: {
            tickInterval: 45,
            min: 0,
            max: 360,
            labels: {
                formatter: function () {
                    return this.value + '°';
                }
            }
        },
        yAxis: {
        //providing tickInterval '1' is not working
        //but providing tickInterval '2' is working
            tickInterval: 1
        },
        plotOptions: {
            series: {
                pointStart: 0,
                pointInterval: 45
            },
            column: {
                pointPadding: 0,
                groupPadding: 0
            }
        },
        series: [{
            type: 'column',
            name: 'Column',
            data: [8, 7, 6, 5, 4, 3, 2, 1],
            pointPlacement: 'between'
        }, {
            type: 'line',
            name: 'Line',
            data: [1, 2, 3, 4, 5, 6, 7, 8]
        }, {
            type: 'area',
            name: 'Area',
            data: [1, 8, 2, 7, 3, 6, 4, 5]
        }]
    });
});

Thanks in advance.

Answer 1

So, That's a good question and what the highcharts doing in tickInterval is its calculating the tickInterval based on the user given value and it rounds values to make more readable.

But, the solution to your problem can be solved using tickPositioner. You can give your own axis value like this :

yAxis: {
   tickPositions: [1, 2, 3, 4, 5],
}

Here is the working jsFiddle

and you can also write a custom function for your tickPositioner like this

var ticks = [];
    for(var i=0;i<10;i++){
    ticks.push(i+1);
    }

yAxis: {
  tickPositions: ticks
}

Here is the jsFiddle