在highcharts中的treemap中单击事件

问题描述 投票:0回答:1

如何在单击最后一级树形图时创建一个onclick处理程序?

这是我使用highcharts(https://jsfiddle.net/r5e0nLkh/2/)创建树图的代码。

$('#container').highcharts({
series: [{
 type: "treemap",
 allowDrillToNode: true,
 alternateStartingDirection: true,
 levelIsConstant: false,
 levels: [{
   level: 1,
   layoutAlgorithm: 'suarified',
   dataLabels: {
     enabled: true,
     align: 'left',
     verticalAlign: 'top',
     style: {
       fontSize: '15px',
       fontWeight: 'bold'
     }
   }
 }, {
   level: 2,
   borderWidth: 0,
   layoutAlgorithm: 'stripes',
   dataLabels: {
     enabled: false
   },
   color: 'blue'
 }],
 data: data
}],
title: {
  text: 'Intent Distribution'
}
});

现在我想在最后一级创建一个点击事件,例如,如果我点击说促销,那么我应该看到子部分,然后如果我点击任何子部分,我可以能够附加一个事件监听器。我可以在highcharts教程中看到linechart的click事件,但不知道如何使用treemap。

javascript highcharts treemap
1个回答
1
投票

通过添加以下方法解决了这个问题:

$('#container').highcharts({
    plotOptions: {
    series: {
        events: {
            click: function (event) {
                if(event.point.node.childrenTotal == 0 ){//since last node will have zero childrens
                   //Perform Task on leaf or last node
            }
        }
    }
},....}

event.point.node.childrenTotal将包含所单击标签的子项数。

© www.soinside.com 2019 - 2024. All rights reserved.