Highcharts x axis label text wrapping lost on setting label step

Question

I have a problem with the Highcharts label wrapping on the X axis .It is lost on setting the label step property as shown in the links below

Correct: http://jsfiddle.ne

Answer 1

It's a bit of a hack, but you could replace each space in the name with <br /> by using the formatter:

labels: {
    step: 1,
    formatter: function () {
        return this.value.replace(/ /g, '<br />');
    }
}

It's not exactly what you want as it doesn't split the name according to the space available between ticks, but maybe you can improve the formatter to better suit your needs (splitting by a given n characters for example instead of by space).

See it running here.

Answer 2

You can use width paramter for labales:

http://jsfiddle.net/ahwmv/2/

labels: {
            style:{
                width:'50px',
            },
            step: 1
        }