Highcharts x-axis label

Question

In chart, the x-axis labels are overlapping, when chart data is big. I have used "step" property as follows :

xAxis: {                
            labels:{
                step: (stepVal ? stepVal : 0),
                },
    }

I calculate the value of stepVal, depending upon data. This resolves the issue of overlapping labels on x-axis. But, when I zoom the chart, I want to see all the labels on x-axis. How to get it?

Answer 1

In Highcharts 3.0 you can use

chart.xAxis[0].update({
    labels: {
        step: newValue
    }
}

for updating step. Just setting new value in options for new chart won't work.

Answer 2

I believe what you are looking for is this..

http://api.highcharts.com/highcharts#chart.events.selection

You would need to change the xAxis labels steps in the event of a zoom action. You will need to determine how many labels you would want to show, based on how many labels are visible as a result of the zoom.