在highcharts中向上和向下钻取时更新图表标题

时间:2014-07-28 16:55:56

标签: highcharts

我想在向上和向下钻取时更新图表标题。钻井时我设法做到了,但钻井时无法想办法。

试试我的jsfiddle,看看我的意思:http://jsfiddle.net/By3s2/1/

chart: {
                type: 'column',
                events:{
                    drilldown: function(e){
                        var chart = this;
                        chart.setTitle({text: e.point.name});

                    },
                    drillup: function(e){
                       //?
                    }
                }
            },

1 个答案:

答案 0 :(得分:0)

如果你只使用一个级别的向下钻取,你可以使用一个变量来保持顶级标题,你会知道,无论你什么时候进行深入挖掘,你都会进入顶层并且应该显示该标题。如果您有多个级别的向下钻取,则必须确定您所处的级别以及相应的标题。检查event.seriesOptions drillup是否有助于解决此问题。

变量:

var chart;
var topLevelSeriesName = "Brands";
var topLevelTitle = "Browser market shares. November, 2013";
var topLevelSubtitle = "Click the columns to view versions. Source: netmarketshare.com.";

图表设置:

chart = new Highcharts.Chart({
    chart: {
        type: 'column',
        renderTo: 'container',
        title: {
            text: topLevelTitle
        },
        subtitle: {
            text: topLevelSubtitle
        },
        events:{
            drilldown: function(e){
                var chart = this;
                chart.setTitle({text: e.point.name}, {text: ''});

            },
            drillup: function(e){
                if(e.seriesOptions.name == topLevelSeriesName) {
                    chart.setTitle({text: topLevelTitle}, {text: topLevelSubtitle});
                }
                else {
                    chart.setTitle({text: e.seriesOptions.name}, {text: ''});
                }
            }
        }
    },

    ...

    series: [{
        name: topLevelSeriesName,
        colorByPoint: true,
        data: brandsData
    }]

    ...

});

这应包括多个级别的向下钻取和更改标题。请参阅this JSFiddle example

相关问题