Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Highcharts Column chart with drilldown, remove hyperlink like formatting from x-axis labels

I am using column chart with drilldown. Here is my JSFIDDLE.

Now my problem is:

  • I want to remove hyperlink like formatting from the labels on x-axis and dataLabels

As you would be able to notice from my fiddle that I have already tried to apply formatting on the x-axis labels by using the code like:

xAxis: {
         type: 'category',
         labels:{
               style:{
                    color: 'red',
                    textDecoration:"none"
               }
         } 
      },

and used following code to format dataLabels:

plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.1f}%',
                            style:{
                               color: 'blue',
                               textDecoration:"none"
                            }
                        }
                    }
                }

But the problem is: The formatting only works for that x-axis labels and dataLabels that does not have drilldown data. While it works on all the x-axis labels and dataLabels of drilldowned data !

Useful references: http://api.highcharts.com/highcharts#xAxis.labels.style http://api.highcharts.com/highcharts#series.data.dataLabels

Any help would be greatly appreciated !

like image 821
Rahul Gupta Avatar asked Jun 27 '14 13:06

Rahul Gupta


1 Answers

We can use drilldown option to control the drilldown.

 drilldown: {
//for axis label
        activeAxisLabelStyle: {
            textDecoration: 'none',
            fontStyle: 'italic'
        },
//for datalabel
        activeDataLabelStyle: {
            textDecoration: 'none',
            fontStyle: 'italic'
        }
}

[Reference:http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/drilldown/labels/][1]

like image 200
sandeep rajbhandari Avatar answered Sep 28 '22 02:09

sandeep rajbhandari