Highcharts树形图面包屑无法返回导航问题咨询

你的问题出在钻取子系列的配置缺失关键属性，导致面包屑无法正确触发返回逻辑，具体修复如下：

核心问题分析 #

1. 钻取子系列未关联主系列：缺少parentSeriesId属性，Highcharts无法识别点击面包屑时需要返回的父系列（即你的主系列client）。
2. 未明确指定子系列类型：虽然主系列是树形图，但钻取子系列默认会使用line类型，需要显式指定type: 'treemap'保证渲染和交互逻辑一致。

修改后的代码 #

Highcharts.chart('container', {
    chart: {
        type: 'treemap'
    },
    series: [{
        id: "client",
        name: 'Client',
        data: [{
            drilldown: "10",
            id: "10",
            name: 'Client 10',
            value: 1184
        }, {
            drilldown: "BE",
            id: "BE",
            name: 'Client BE',
            value: 647
        }]
    }],
    drilldown: {
        series: [{
            id: '10',
            type: 'treemap', // 显式指定树形图类型
            parentSeriesId: 'client', // 关联到主系列id
            name: 'attribute_id',
            data: [{
                id: "10||CF  ",
                name: "Attr CF  ",
                value: 1184
            }]
        }, {
            id: 'BE',
            type: 'treemap', // 显式指定树形图类型
            parentSeriesId: 'client', // 关联到主系列id
            name: 'attribute_id',
            data: [{
                id: "BE||BF  ",
                name: "Attr BF  ",
                value: 647
            }]
        }]
    }
});

关键修改点说明 #

• 给每个钻取子系列添加type: 'treemap'，确保图表类型一致，避免交互逻辑冲突。
• 添加parentSeriesId: 'client'，将子系列与主系列绑定，这样面包屑点击时，Highcharts就能正确加载主系列完成返回操作。
• 移除子系列数据中的parent属性：因为钻取是切换整个系列，而非在同一系列中展示层级，这个属性在这里是多余的。

内容的提问来源于stack exchange，提问作者Bub