Highcharts X-axis categories

Question

Am using highcharts and would like to know how to categorise the x-axis based on values.

Here is my code and would like to categorise 0-25 as A, 25-50 as B, 50-75 as C and 75-100 as D.

Could you kindly let me know on how to achieve this.

$(function () {
    $('#container').highcharts({
        title: {
            text: 'Chart reflow is set to true'
        },

      


        xAxis: {
            min:0,
            max:100,
            tickInterval: 25,
            
        },
          yAxis: {
			min:0,
            max:10,
            tickInterval:2,
            title: {
                text: 'values'
            },
          
        },

        series: [{
            data: [[2,1], [15,3], [30,6], [50,9.5], [60,9.8],
                  [83,5], [90,3],[99,0.2]]
        }]
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

Answer 1

use this : Here is your updated fiddle

  labels: { 
    formatter: function() {
       if(this.value == 0 )
        return "A";
        if(this.value == 25)
             return "B";
         if(this.value == 50)
             return "C";
    } 
}