[Solved]-How to achieve Multiple drill down using the Axis Labels-Highcharts

demo

you need to add this code to make x-axis label clickable with formatting (underline):

(function (h) {
        //for x-axis labels
        h.wrap(h.point.prototype, 'init', function (proceed, series, options, x) {
            var point = proceed.call(this, series, options, x),
                chart = series.chart,
                tick = series.xaxis && series.xaxis.ticks[x],
                ticklabel = tick && tick.label;
            //console.log("series");
            //console.log(series);
            console.log("point = ");
            console.log(point);

            if (point.drilldown) {

                if (ticklabel) {
                    if (!ticklabel._basicstyle) {
                        ticklabel._basicstyle = ticklabel.element.getattribute('style');
                    }
                    ticklabel.addclass('highcharts-drilldown-axis-label').css({
                        'text-decoration': 'underline',
                        'font-weight': 'normal',
                        'cursor': 'pointer',
                        'color':'brown'
                        }).on('click', function (){
                        //alert('clicked');
                        //point.dodrilldown();  
                                                                                                      point.firepointevent('click');

                        }); 
                }
            } 
            else if (ticklabel && ticklabel._basicstyle) 
            {
            }

            return point;
        });
    })(highcharts);