krishnaku
Posts: 8
Joined: Wed Jun 17, 2020 5:26 pm

Zones on a Quadrant Chart

Hello,

I have a quadrant chart that is basically a scatter chart with four quadrants defined by fixed lines markers on the x and y axis.
Screen Shot 2022-05-15 at 11.34.44 AM.png
Screen Shot 2022-05-15 at 11.34.44 AM.png (126.3 KiB) Viewed 1118 times
I'd like to have the points in each quadrant have different colors. Can I use zones to do this or will I just need to create separate series ahead of time for each zone? The reason I would prefer not to use series for this is because I am already using series to separate out points along another attribute and I would like to have the option of keeping that so that I can further filter out points by that attribute by turning off/on series.

Another option to indicate the four quadrants is by using text labels like I have above, and I tried using annotations for this, but its been hard to figure out how to position them in way that looks nice across different sizes of data.


Krishna
hubert.k
Posts: 1164
Joined: Mon Apr 11, 2022 11:48 am

Re: Zones on a Quadrant Chart

Hello Krishna,
Thanks for contacting us with your question!

You can change the color of points based on a quarter of the chart in chart.events.load function, where you can check the position of the point and update it with the desired color. To create a text in quarters you can use a Highcharts SVGRenderer and place the text in a proper quarter of the chart. You can see the demo below.

Demo: https://jsfiddle.net/BlackLabel/dh73gt2p/
API Reference: https://api.highcharts.com/highcharts/chart.events.load
https://api.highcharts.com/class-refere ... derer#text

Let me know if you have any further questions!
Regards!
Hubert Kozik
Highcharts Developer

Return to “Highcharts Usage”