如何使用Axis标签实现多次向下钻取

时间:2014-07-24 06:06:51

标签: javascript jquery graph charts highcharts

我想在高图表中使用Axis Labels向下钻取我使用条形图实现多次向下钻取但我无法使用访问标签

我如何实现它,

这是我的小提琴

[DEMO] [1]

[1]: http://jsfiddle.net/mohamedmusthafac/d6fw7/

1 个答案:

答案 0 :(得分:2)

<强> DEMO

您需要添加此代码以使x轴标签可以通过格式化(下划线)进行点击:

(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);