CODEWITHSUNDEEP
javascriptjqueryhighchartsdrilldown
Citris
Citris

Reputation: 79

Highcharts remove labels after chart creation / drilldown

I have a graph in highcharts that has 2 sets of drill down data plus the top level. When I get to the last graph, there are as many as 100 xAxis categories. Because of this the labels become unreadable. I am running this snippet of code to try and disable the labels just on the last drill down.

chart.options.xAxis[0].labels.enabled = false;

this is being run before chart.redraw();

For some reason it still shows the labels, even tho when using console.log, I can see it's set to disabled. Any help would be appreciated.

Upvotes: 0

Views: 3351

Answers (1)

Sebastian Bochan
Sebastian Bochan

Reputation: 37588

You can add extraparamter for drilldown object,

Example: http://jsfiddle.net/BujyF/

drilldown: {
                    name: 'Firefox versions',
                    categories: ['Firefox 2.0', 'Firefox 3.0', 'Firefox 3.5', 'Firefox 3.6', 'Firefox 4.0'],
                    enabledLabels:false,
                    data: [0.20, 0.83, 1.58, 13.12, 5.43],
                    color: colors[1]
                }

modify setChart() function to add this param to series. 

function setChart(name, categories, data, color,labels) {
        chart.xAxis[0].setCategories(categories, false);
        chart.series[0].remove(false);
        chart.addSeries({
            name: name,
            data: data,
            enabledLabels:labels,
            color: color || 'white'
        }, false);
        chart.redraw();
    }

Then use formatter (for labels) http://api.highcharts.com/highcharts#xAxis.labels.formatter to check if labels should be displayed or not. 

xAxis: {
            categories: categories,
            labels:{
                formatter:function(){
                    if(!this.axis.series[0].options.enabledLabels && this.axis.series[0].options.enabledLabels!=undefined)
                    {
                       return null;
                    }
                    else
                    {
                        return this.value;
                    }

                }
            }
        },

Upvotes: 1

Related Questions