2

我正在做一个 Highchart 馅饼。当我单击一个切片时，我想进行向下钻取并更新我的图表标题。

我的钻取工作正常。我更新标题的方法也是如此。

但是，当我尝试在同一次单击时更新和向下钻取时，它不起作用，因为向下钻取似乎发生在我可以捕捉到单击的点值之前。

这是一个 JSFiddle 来说明我的观点。

这是我的js代码：

$(function () {
        status_ = [['Ouverts', 896],['En cours',8],['Résolus - Clôs',0],['Ouverts', 3],['En cours',65],['Résolus - Clôs',0],['Ouverts', 427],['En cours',193],['Résolus - Clôs',0],['Ouverts', 48],['En cours',41],['Résolus - Clôs',0],['Ouverts', 2],['En cours',0],['Résolus - Clôs',0],['Ouverts', 38],['En cours',42],['Résolus - Clôs',0],['Ouverts', 244],['En cours',123],['Résolus - Clôs',0],['Ouverts', 5],['En cours',222],['Résolus - Clôs',0],['Ouverts', 441],['En cours',0],['Résolus - Clôs',0],['Ouverts', 259],['En cours',2],['Résolus - Clôs',0],['Ouverts', 16],['En cours',2],['Résolus - Clôs',0],['Ouverts', 6],['En cours',0],['Résolus - Clôs',0]];
        var browserData = [];
        var drillDownSerie = [];

        for (var i = 0; i <18 ; i++) {

            // add browser data
            browserData.push({
                name: i,
                y: i
                //if you uncomment here the drilldown works but not the title update
                //,drilldown: i
            });

            drillDownSerie.push({
                id: i,
                data: [status_[3 * i],
                status_[3 * i + 1],
                status_[3 * i + 2]
            ]
            });
            }

            $('#summary').highcharts({
            chart: {
                type: 'pie'
            },
            title: {
                text: 'Répartition des 3000 derniers tickets'
            },
            plotOptions: {
                series: {
                    dataLabels: {
                        enabled: true,
                        format: '{point.name}: {point.y}'
                        },
                    point:{
                        events:{
                            click: function(){
                                UpdateTitle(this.y);
                            }
                        }
                    }
                }
            },

            tooltip: {
                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y}</b> of total<br/>'
            }, 
            credits : {enabled : false},
            series: [{
                name: 'Département',
                colorByPoint: true,                                     
                data: browserData
            }],
            drilldown: {
                series: drillDownSerie
            }
        });
        var chart =  $('#summary').highcharts();


        function UpdateTitle(argument1) {
           chart.setTitle({
        text: argument1
        })
        }


    })
4

1 回答 1

2

为什么要使用点击事件？使用drilldown和drillup，见：

于 2014-04-29T11:44:48.693 回答