仅显示 Treemap HighCharts 的 1 个子节点

Question

我正在研究 TreeMap highcharts API。

当我单击任何节点时，它会转到子节点，但是当我到达最后一个节点时，只有子节点显示没有其他节点。

我的要求是，当我单击任何那个子节点时，只有那个子节点会显示在 treeMap 中，其他子节点应该是不可见的。

下面是我的代码。

Highcharts.chart('container', {

    series: [{

        type: 'treemap',

        layoutAlgorithm: 'squarified',

        allowDrillToNode: true,

        animationLimit: 1000,

        allowTraversingTree: true,

        interactByLeaf : false,

        dataLabels: {

            enabled: false

        },

        levelIsConstant: false,

        levels: [{

            level: 1,

            dataLabels: {

                enabled: true

            },

            borderWidth: 3

        }],

        data: points

    }],

    subtitle: {

        text: 'Click points to drill down. Source: <a href="http://apps.who.int/gho/data/node.main.12?lang=en">WHO</a>.'

    },

    title: {

        text: 'Global Mortality Rate 2012, per 100 000 population'

    },  

    plotOptions: {

        series: {

            events: {

                click: function (event) {

                    if (event.point.node.childrenTotal == 0) {

                       alert('test')                           

                    }

                }

            }

        }

    }

});   

请帮我解决这个问题

if (event.point.node.childrenTotal == 0){

    //

 }

我们需要在这一行中编写的内容只显示树形图中的可点击节点，其他节点应该是不可见的。

或者，是否有任何其他属性可以在没有单击事件的情况下处理此要求。

Answer 1

要达到这种效果，您需要以适当的方式定义数据 - 将下一个子级嵌套到层次结构中间的点。像这儿：&nbsp; series: [{&nbsp; &nbsp; type: "treemap",&nbsp; &nbsp; allowDrillToNode: true,&nbsp; &nbsp; data: [{&nbsp; &nbsp; &nbsp; &nbsp; id: 'B',&nbsp; &nbsp; &nbsp; &nbsp; name: 'Bananas',&nbsp; &nbsp; &nbsp; &nbsp; color: "#ECE100"&nbsp; &nbsp; &nbsp; }, {&nbsp; &nbsp; &nbsp; &nbsp; name: 'Test',&nbsp; &nbsp; &nbsp; &nbsp; parent: 'B',&nbsp; &nbsp; &nbsp; &nbsp; id: 'Test',&nbsp; &nbsp; &nbsp; &nbsp; value: 10&nbsp; &nbsp; &nbsp; }, {&nbsp; &nbsp; &nbsp; &nbsp; name: 'Test',&nbsp; &nbsp; &nbsp; &nbsp; parent: 'Test',&nbsp; &nbsp; &nbsp; &nbsp; value: 2&nbsp; &nbsp; &nbsp; }]&nbsp; }]演示：https ://jsfiddle.net/BlackLabel/Lkzpey9v/API：https ://api.highcharts.com/highcharts/series.treemap.allowDrillToNode