Javascript HighCharts:向下钻取/向上钻取时树映射数据标签不一致

假设有一个三级树状图，在本例中为“大陆->国家->原因”。我希望向下钻取时数据标签保持一致，以便：

• 当前级别的标签居中，字体较大
• 下一层的标签位于左上角
• 下一个标高后的标高标签不显示

例如，在一开始，目前的水平是大陆。中心应以大字体显示“非洲”和“欧洲”等字样。每个国家/地区应显示在左上角。原因应该是看不见的

当深入到国家一级时，“匈牙利”和“法国”应以大字体显示在中心。原因应显示在左上角。大陆应该是看不见的。当向下钻取另一个层次的原因时，原因应该显示在中心，其余的应该不可见

我正在使用此代码来执行此操作。看

起初，一切看起来都很好。第一个可见级别（大陆）的标签居中且较大，下一个级别（国家）的标签位于左上角。然而，当深入到国家层面时，国家的标签是以中央为中心的，但是小（应该是大的）。原因在左上角，与预期的一样小。向下钻取另一个层次的原因看起来很相似：标签居中，但很小（应该很大）

这就是它变得奇怪的地方：钻到一个水平的国家再次我得到了我想要的结果，但只有一个国家，我以前看到的。我之前看到的这个国家现在是以中心为中心的大国家，但其他国家仍然很小。深入到另一个国家并进行备份也会改变该国家的字体大小，其他国家的字体仍然很小。向上钻到大陆会导致国家标签（左上角应该很小）位于左上角，但很大，但同样只适用于我钻到的那些国家。其余的都很小，如预期的那样位于左上角

这看起来很不一致，但我不完全确定这是一个bug。我做错了什么？

这样解决：

var电流_电平=1；
函数get_current_level（）{
var rootNode=this.series[0]。rootNode；
if（rootNode==''）{
当前_水平=1；
}否则{
if（rootNode.split（“”“）.length==2）{
当前_水平=2；
}else if（rootNode.split（“”“）.length>=2）{
当前_水平=3；
}
}
}
var图表=$（“#容器”）。highcharts({
图表：{
活动：{
重画：获取当前级别
}
},
xAxis：{
活动：{
设置极限：获取当前水平
}
},
亚克斯：{
活动：{
设置极限：获取当前水平
}
},
系列：[{
类型：'treemap'，
布局算法：“squarified”，
allowDrillToNode:true，
数据标签：{
启用：false，
格式化程序：函数（）{
var点=此点；
如果（当前水平==点水平和当前水平！=3）{
返回“”+point.name+“”；
}else if（当前|u级别==点级别-1 |当前|u级别==3）{
返回“”+point.name+“”；
}否则{
返回null；
}
}
},
levelIsConstant:false，
级别：[{
级别：1，
数据标签：{
启用：对，
},
边框宽度：3
}, {
级别：2，
数据标签：{
对齐：“左”，
垂直排列：“顶部”，
已启用：true
},
边框宽度：3
}],
数据：点数
}],
副标题:{
文本：“单击点向下钻取。来源：。”
},
标题：{
正文：“2012年全球死亡率，每10万人口”
}
});

    series: [{
        type: 'treemap',
        layoutAlgorithm: 'squarified',
        allowDrillToNode: true,
        levelIsConstant: false,
        dataLabels: {
            enabled: false
        },
        levels: [{
            level: 1,
            dataLabels: {
                enabled: true,
                style: {
                    fontSize: '20px'
                }
            },
            borderWidth: 3
        },{
            level: 2,
            dataLabels: {
                align: "left",
                verticalAlign: "top",
                enabled: true
            },
            borderWidth: 3
        }],
        data: points
    }]

  var current_level = 1;

  function get_current_level() {
    var rootNode = this.series[0].rootNode;

    if (rootNode === '') {
      current_level = 1;
    } else {
      if (rootNode.split('_').length == 2) {
        current_level = 2;
      } else if (rootNode.split('_').length >= 2) {
        current_level = 3;
      }
    }
  }

  var chart = $('#container').highcharts({
    chart: {
      events: {
        redraw: get_current_level
      }
    },
    xAxis: {
      events: {
        setExtremes: get_current_level
      }
    },
    yAxis: {
      events: {
        setExtremes: get_current_level
      }
    },
    series: [{
      type: 'treemap',
      layoutAlgorithm: 'squarified',
      allowDrillToNode: true,
      dataLabels: {
        enabled: false,
        formatter: function () {
          var point = this.point;
          if (current_level == point.level && current_level != 3) {
            return '<span style="font-size:20px">' + point.name + "<span>";
          } else if (current_level == point.level - 1 || current_level == 3) {
            return '<span>' + point.name + "<span>";
          } else {
            return null;
          }
        }
      },
      levelIsConstant: false,
      levels: [{
        level: 1,
        dataLabels: {
          enabled: true,
        },
        borderWidth: 3
      }, {
        level: 2,
        dataLabels: {
          align: "left",
          verticalAlign: "top",
          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'
    }
  });