[Vuejs]-Vue-ApexChart Set color on individual bars based on another series value

by

0👍

As I understand it, you wish to be able to customize the values 55 and 111 based on some changing goal eg the target on Bar 1 is 10 but on Bar 2 is 20.

According to the source code, color functions receive the following object:

{
     seriesIndex: this.seriesIndex, // the data series being coloured
     dataPointIndex: opts.dataPointIndex, // the index for that bar
     value: opts.value, // the value for that bar
     w: w // ??
}

My approach would be to store the targets as an array then just access the threshold for each date using the index value

colors: [
   function ({ value, dataPointIndex }) {
     if (targets[dataPointIndex] > ) {
          return Colors.red
     } else {      
          return Colors.green
     }
}]

Leave a comment