Щелкните дочерний элемент на диаграмме солнечных лучей, разверните родительский элемент

Question

У меня есть диаграмма солнечных лучей в Highcharts, и я хочу, чтобы при нажатии на «дочерний» элемент он увеличивал / детализировал родительский элемент. См. Изображение для визуального объяснения. введите описание изображения здесь

Я могу жестко запрограммировать «Финансовую» цель, которую я хочу, например:

mychart.series[0].data[1]

на основе моей структуры данных. И я видел в сети, что могу использовать для этой цели функцию doDrilldown (), но она просто никогда не работает. Я потратил на это несколько часов.

Я также пытался запускать события «щелчок» в родительском элементе, но безрезультатно.

Answer 1

После нескольких часов поиска я наконец нашел решение, которое сработало для меня!

Мне пришлось вручную go через файл js Highcharts * для Sunburst, чтобы в конечном итоге найти эту функцию:

chart.series[0].setRootNode(drillId, true, {trigger: 'click'});

В моем случае DrillId для «Financial» был «financial». Каким-то чудом это работает.

Вместо жесткого кодирования вы можете просто получить родительский идентификатор DrillId из события щелчка, подобного этому (настроенного в самой серии диаграмм):

series: [{
    type: 'sunburst',
    data: data,
    events: {
              click: function(event) {
                //console.log(event.point);
                var id = event.point.id;
                var parent = event.point.parent;  // also the drillId
                
                // ... do logic here
                
              }          
            },
     // and so on