Highcharts Sunburst 自定义图例和点击功能

Question

Sunburst 自定义图例和点击功能我有大量关于森伯斯特的数据，我想在右侧显示 2 级图例。因为我知道这些值，所以我制作了一个自定义图例，所有 2 级数据都作为链接。但是我没有得到所有级别的颜色代码。

我使用了 var colors = Highcharts.getOptions().colors;

但我只得到几个颜色代码。

如何获得图表中使用的完整颜色代码？
当我单击该图例时，我只想在图表中显示该级别及其子级别。（与图中可用的默认功能相同）。我该怎么做？

请帮忙

Answer 1

我在你的代码中添加了一个颜色变量：

const color = i >= colors.length ? colors[i - colors.length] : colors[i];

演示：http://jsfiddle.net/BlackLabel/qb7ckxwn/

以下是如何在突出元素上触发旭日图向下钻取的方法：

document.getElementById('btn').addEventListener('click', function(){
chart.series[0].points.forEach(d => {
    if (d.name === 'Asia') {
        chart.series[0].setRootNode(d.id, true, { trigger: 'click' })
    }
})

})

演示：https://jsfiddle.net/BlackLabel/t7pghmxd/

Highcharts Sunburst 自定义图例和点击功能

Highcharts Sunburst custom legend and click functionality

javascript

highcharts

sunburst-diagram