更改 ApexCharts 中单个数据标签的颜色

Question

我想更改条形图中特定值的数据标签颜色。

文档说：

Also, if you are rendering a bar/pie/donut/radialBar chart, you can pass a function which returns color based on the value.

我知道这是用于条形颜色，但我尝试将它用于数据标签颜色。当然没有用。知道怎么做吗？

我的代码笔：https://codepen.io/osmanyasircankaya/pen/gOXELmB

 style: {
  colors: [
    function ({ w }) {
      if (w.config.series[0].data[4] > 3) {
        return "#ff0014";
      } else {
        return "#1f52b0";
      }
    },
  ],
},

文档：

https://apexcharts.com/docs/options/colors/

https://apexcharts.com/docs/options/datalabels/

Answer 1

在您的函数中，您一遍又一遍地检查单个数据点的值 data[4]。您需要做的是像这样检查当前系列和数据点：

   function ({ seriesIndex,dataPointIndex,  w }) {
     if (w.config.series[seriesIndex].data[dataPointIndex] > 3) {
       return "#ff0014";
     } else {
       return "#1f52b0";
     }
   },

更改 ApexCharts 中单个数据标签的颜色

change color of single dataLabel in ApexCharts

apexcharts