изменить dataLabels на старших графиках в зависимости от цвета бара

Question

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

dataLabels: {
        enabled: true,
        formatter:function() {
            var pcnt = (this.y / dataSum) * 100;
            // return Highcharts.numberFormat(pcnt) + '%';
            return '<tspan style="color:' + this.point.color + '">' + Highcharts.numberFormat(pcnt) + '%' + '</tspan>';
        }

полный код находится в здесь

Answer 1

Причина этой проблемы заключается в том, что метки данных отображаются до шаблонов SVG, которые вы определили в параметрах в массиве colors.Диаграмма перерисовывается при изменении ширины контейнера и применяются правильные значения.

Перед перерисовкой ([object Object] не является правильным значением fill):

<tspan style="fill:[object Object]" x="5" y="16">25.00%</tspan>

После перерисовки:

<tspan style="fill:url(#highcharts-gbd5ohb-4)" x="5" y="16">25.00%</tspan>

Я не думаю, что это можно рассматривать как ошибку - API указывает, что только гексподдерживаются значения цвета: https://api.highcharts.com/highcharts/colors

В качестве обходного пути вы можете переместить определение dataLabels.formatter в update функцию в chart.events.load:

events: {
   load: function() {         
     this.update({
       plotOptions: {
          series: {
             dataLabels: {
               formatter:function() {
                  var pcnt = (this.y / dataSum) * 100;
                  // return Highcharts.numberFormat(pcnt) + '%';
                   return '<tspan style="color:' + this.point.color + '">' + Highcharts.numberFormat(pcnt) + '%' + '</tspan>';
              }}
          }
       }
     });
   }
}

Живая демоверсия: https://codepen.io/anon/pen/PeGWrx