silestis
Posts: 19
Joined: Thu Mar 15, 2018 10:25 am

[Heatmap] Combination of linear gradient and data classes color axes

Tue Sep 28, 2021 2:56 am

Hello!

Is it possible to create a heatmap with color axes defined like this?
  • To 10 - dark blue data class (all points with value up to 10 are just dark blue)
  • From 10 to 20 - linear gradient (from dark to light blue)
  • From 20 to 40 - white data class (all points within this range are just white)
  • From 40 to 50 - linear gradient (from light to dark red)
  • From 50 - dark red data class (all points bigger than 50 are just dark red)
I have researched and tried a lot, but all I can do is just define either steps for linear gradient axis or data classes, but nothing between, no combination ...

Thanks for help!

magdalena
Posts: 132
Joined: Tue Aug 24, 2021 1:32 pm

Re: [Heatmap] Combination of linear gradient and data classes color axes

Tue Sep 28, 2021 12:05 pm

Hi,

Thanks for contacting us!

Here is a simple example of your color combination, using stops on the colorAxis.

Demo:
https://jsfiddle.net/BlackLabel/xL53z2ft/

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

silestis
Posts: 19
Joined: Thu Mar 15, 2018 10:25 am

Re: [Heatmap] Combination of linear gradient and data classes color axes

Wed Sep 29, 2021 3:12 am

Thanks a lot, magdalena. This is exactly what we need.

magdalena
Posts: 132
Joined: Tue Aug 24, 2021 1:32 pm

Re: [Heatmap] Combination of linear gradient and data classes color axes

Wed Sep 29, 2021 8:16 am

You're welcome! In case of any further questions, feel free to contact us again.

Return to “Highcharts Usage”