Multiple colour axis for table heatmap

I’m trying to recreate something like this:

In other words I need to make a heatmap with independent X axis, each one with it’s own heatmap colour schema (i.e some the higher the number the greener the backroung) others the opposite.

I know this is not possible with High-Charts. I was wondering if it would be possible with Is it? is there an example I can have a look at?


You can try something like:

Hi Etienne! This is great, thank you sooo much!

I’ve tried to make it work and everything seems fine however my text
doesn’t load correctly even though I have a litterarily identical heat map
where the text loads just fine. Do you know why this happens? Is it due to
this double axis setting?

This is the “broken” chart:
While this is the one that loads the data fine but it’s not divided in two

Thanks again for the help!

Your annotations have categorical x coordinates whereas your heatmap’s are numerical.

Hi, I’m really sorry for bothering, but I really can’t seem to get it to
I edited the chart, now I have all categorical axis. (see

However it still doesn’t render properly.

Thanks A LOT for the help, I really do appreciate it.

Ok, I figured that the X axis needs to have the same lenght of the Y axis. Now things are slightly better but I’m still missing something

It’s probably best to use a numerical x axis and ticktext and tickvals to avoid duplication which may lead to possible bugs for data like you have.

Here’s what I came up with: