It is currently Mon Jun 25, 2018 4:12 am Advanced search

Multi color in single Column

Technical support, bug reports and more.

Multi color in single Column

Postby vivekchand » Wed Jun 13, 2018 4:37 pm

Hi Everyone,
I am trying to a create a column graph with multi color based on the Y axis value. For e.g I have a Apples on X-axis and it has a values 180 and benchmark is 120. My requirement is 0-50 i should see green, 50-120 i should see yellow and 120-180 i should see red. can you please help. Please find the attachment, Thank you
Attachments
MultiColor.png
MultiColor.png (3.5 KiB) Viewed 77 times
vivekchand
 
Posts: 2
Joined: Wed Jun 13, 2018 4:22 pm

Re: Multi color in single Column

Postby vivekchand » Thu Jun 14, 2018 4:13 pm

Can someone please let me know, is it possible do it or not or any kind of small idea, I can take it from there. That could be really helpful thank you
vivekchand
 
Posts: 2
Joined: Wed Jun 13, 2018 4:22 pm

Re: Multi color in single Column

Postby daniel_s » Fri Jun 15, 2018 12:36 pm

hi vivekchand,

My apologise for a little bit of late, and welcome on our forum!
Of course it's possible, but you need to process your current data on Chart.events.load and replace it with three new series (stacked). I prepared the example which shows how to achieve it, so please take a look on it. I left comments on code, but If something isn't understandable or clear enough, please let me know about it, then I will try to explain it more precisely.

Live example: https://jsfiddle.net/1hpx938a/1/

API Reference:
https://api.highcharts.com/highcharts/chart.events.load
https://api.highcharts.com/highcharts/series.column.stacking
https://api.highcharts.com/class-reference/Highcharts.Chart#update

Best regards!
Daniel Studencki,
Highcharts Developer
daniel_s
 
Posts: 673
Joined: Fri Sep 01, 2017 1:01 pm


Return to Highcharts Usage

Who is online

Users browsing this forum: No registered users and 2 guests