Раскрашивание treemap по родительскому узлу в режиме в стиле highcharts

Question

Я пытаюсь создать treemap в стиле высоких графиков и окрасить узлы их родительскими узлами, например, в this example.

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

{ 
    name: 'Anne', 
    parent: 'A', 
    value: 5, 
    className: 'highcharts-color-1' 
} 

Смотрите мой пример: https://jsfiddle.net/kimpalita/1tLue9s0/

мне было интересно, если кто-то может предложить более элегантный/упрощенный способ сделать это, не повторяя свойство className в каждой отдельной точке данных.

Спасибо заранее!

Answer 1

Я не думаю, что родительский узел и его дети имеют класс css, чтобы отличать их от других узлов. Но вы можете добавить код, чтобы добавить родительское имя класса к своим дочерним элементам, что позволяет пропустить указание имени класса для каждой точки.

chart: { 
    events: { 
     load: function() { 
     this.series[0].data.forEach(p => { 
      var parent = p.parent; 
      var className = parent && this.get(parent).className; 
      if (className !== undefined) { 
      p.graphic.addClass(className) 
      } 
     }) 
     } 
    } 
    }, 

пример: