Highcharts xAxisラベルの色を個別に変更するにはどうすればいいですか？

Question

私は、次を使用して、私のチャートX軸ラベルの色を変更することができました：

Highcharts.chart('container', { 
    chart: { 
    marginBottom: 80 
    }, 
    xAxis: { 
    categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], 
    labels: { 
     style: { 
     color: 'red' 
     } 
    } 
    }, 
    series: [{ 
    data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 
    }] 
}); 

上記の変更、が、すべてのX軸のラベルは赤にします。

「月」は「2月」は青で、赤になるように、どのようにして、個別に各ラベルの色を変更することができ、など

Working example

Answer 1

あなたはAxis.labels.formatterを使用して、ラベルを返すことができますあなたの色を定義できるスタイル属性を持つhtmlタグで。

const color = { 
    Jan: 'red', 
    Feb: 'green', 
    Mar: 'blue' 
} 

const chart = Highcharts.chart('container', { 
    chart: { 
    marginBottom: 80 
    }, 
    xAxis: { 
    categories: ['Jan', 'Feb', 'Mar'], 
    labels: { 
     formatter() { 
     return `<span style="color: ${color[this.value]}">${this.value}</span>` 
     } 
    } 
    }, 

    series: [{ 
    data: [29.9, 71.5, 106.4] 
    }] 
}) 


console.log(chart.series[0].data) 

ライブ例： http://jsfiddle.net/508jej83/

Answer 2

私はあなたのために願っています！

xAxis : {    
       categories : _category, 
       labels : { 
        formatter : function() { 
         if (_category != null && _category.length > 0) { 
          var currentColumn = -1; 
          for (var i = 0; i < _category.length; i++) { 
           if (_category[i] == this.value) { 
            currentColumn = i; 
            break; 
           } 
          } 

          if (isNumberEven(currentColumn)) {        
           return '<span style="fill: blue;">' + this.value + '</span>'; 

          } else { 
           return this.value; 
          } 

         } 
        } 

       } 

      }