How Do You Change the Color of a Bar based on the Value of Another Series

[Whalensdad]

I have a chart that shows a 12 month rolling window. The bars for the first 6 months need to be 1 color and the bars for the second 6 months a different color. I 've tried using the row number in my dataset as well as adding a "color" attribute to the data set. Here are 2 charts the first is what I'm starting with and the second is what I'm looking to do. I've also included a sample dataset.



The data series that will have a different color is the "Total". The chart shows the Sold vs the Total for the first 6 months, and the only the Total the last 6 months. For the first 6 months the Total should be lightgray, and should be lightblue for the last 6 months.

{Axis:1.05,AxisInterval:0.2,Total:646,Sold:628,Color:'LightGray',MonthYear:'Jan2022',SOLD_MONTH:'Jan',SoldDate:'2022-01-01',Row:'1',pct_Monthly_Sold:'97.2%'}
{Axis:1.05,AxisInterval:0.2,Total:848,Sold:815,Color:'LightGray',MonthYear:'Feb2022',SOLD_MONTH:'Feb',SoldDate:'2022-02-01',Row:'2',pct_Monthly_Sold:'96.1%'}
{Axis:1.05,AxisInterval:0.2,Total:1028,Sold:934,Color:'LightGray',MonthYear:'Mar2022',SOLD_MONTH:'Mar',SoldDate:'2022-03-01',Row:'3',pct_Monthly_Sold:'90.8%'}
{Axis:1.05,AxisInterval:0.2,Total:846,Sold:780,Color:'LightGray',MonthYear:'Apr2022',SOLD_MONTH:'Apr',SoldDate:'2022-04-01',Row:'4',pct_Monthly_Sold:'92.1%'}
{Axis:1.05,AxisInterval:0.2,Total:889,Sold:846,Color:'LightGray',MonthYear:'May2022',SOLD_MONTH:'May',SoldDate:'2022-05-01',Row:'5',pct_Monthly_Sold:'95.1%'}
{Axis:1.05,AxisInterval:0.2,Total:648,Sold:591,Color:'LightGray',MonthYear:'Jun2022',SOLD_MONTH:'Jun',SoldDate:'2022-06-01',Row:'6',pct_Monthly_Sold:'91.2%'}
{Axis:1.05,AxisInterval:0.2,Total:382,Sold:null,Color:'LightBlue',MonthYear:'Jul2022',SOLD_MONTH:'Jul',SoldDate:'2022-07-01',Row:'7',pct_Monthly_Sold:}
{Axis:1.05,AxisInterval:0.2,Total:240,Sold:null,Color:'LightBlue',MonthYear:'Aug2022',SOLD_MONTH:'Aug',SoldDate:'2022-08-01',Row:'8',pct_Monthly_Sold:}
{Axis:1.05,AxisInterval:0.2,Total:197,Sold:null,Color:'LightBlue',MonthYear:'Sep2022',SOLD_MONTH:'Sep',SoldDate:'2022-09-01',Row:'9',pct_Monthly_Sold:}
{Axis:1.05,AxisInterval:0.2,Total:145,Sold:null,Color:'LightBlue',MonthYear:'Oct2022',SOLD_MONTH:'Oct',SoldDate:'2022-10-01',Row:'10',pct_Monthly_Sold:}
{Axis:1.05,AxisInterval:0.2,Total:122,Sold:null,Color:'LightBlue',MonthYear:'Nov2022',SOLD_MONTH:'Nov',SoldDate:'2022-11-01',Row:'11',pct_Monthly_Sold:}
{Axis:1.05,AxisInterval:0.2,Total:293,Sold:null,Color:'LightBlue',MonthYear:'Dec2022',SOLD_MONTH:'Dec',SoldDate:'2022-12-01',Row:'12',pct_Monthly_Sold:}

[kamil.m]

Hi there,

You can achieve it with a point.update method.
I have created a simple function that changes the color based on certain conditions. Take a look at it and try to apply it to your chart, and conditions.
DEMO: https://jsfiddle.net/BlackLabel/7mwkfpn4/
API Reference: https://api.highcharts.com/class-refere ... int#update

Also another way would be to use series.zones property. Take a look at the links below:
DEMO: https://jsfiddle.net/BlackLabel/jg6pk93z/
API Reference: https://api.highcharts.com/highcharts/s ... lumn.zones

Let me know if that was what you were looking for,
Kind regards!

[Whalensdad]

Kamil - This is Exactly what I was looking for. This works! Thank You.

[kamil.m]

That's great to heard that! I'm glad that I could help.

Have a nice day!