Axes for Annotated Heatmaps in Python

📊 Plotly Python
1

I’m trying to extend this example:

import plotly.figure_factory as ff
import numpy as np
np.random.seed(1)
 
z = np.random.randn(20, 20)
z_text = np.around(z, decimals=2) # Only show rounded value (full value on hover)
 
fig = ff.create_annotated_heatmap(z, annotation_text=z_text, colorscale='Greys',
                                   hoverinfo='z')
 
for i in range(len(fig.layout.annotations)):
    fig.layout.annotations[i].font.size = 8

fig.show()

…by adding x and y axes labels. When I use numbers that are relatively small (1-20) it’s ok, BUT if the numbers are large like 0-2000 it seems to fall apart when it’s displayed.

for instance, here the y is 1-20 and the x is 1-2000:

image
image814×119 4.04 KB

for x/y I’m adding them like:

xx=[100,200,300,400,500,600,700,800,900,1000,1100,1200,1300,1400,1500,1600,1700,1800,1900,2000]
yy=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]

and then:

fig = ff.create_annotated_heatmap(z, x=xx, y=yy, annotation_text=z_text, colorscale='Greys', hoverinfo='z')

any ideas?

thx!

EDIT:
I should add that the same thing happens when applied to the y axis:
image

2

Hi @jayveesea,

It looks like figure_factory interprets the xand y parameters as list of int or float when there is no letter in the label. This looks like a bug to be. In the mean time you can use this hack:

import plotly.figure_factory as ff
import numpy as np
np.random.seed(1)


N=5
z = np.random.randn(N,N)
z_text = np.around(z, decimals=2) # Only show rounded value (full value on hover)
    
xx= [f'<br>{i}' for i in np.linspace(100,2000,N).astype(int)]
yy= ['<br>'+str(i) for i in np.linspace(1,20,N).astype(int)]
fig = ff.create_annotated_heatmap(z.tolist(), x=xx, y=yy, annotation_text=z_text, colorscale='Greys', hoverinfo='z')

for i in range(len(fig.layout.annotations)):
    fig.layout.annotations[i].font.size = 8
fig.show()

hope it helps,

Alex-

PS: don’t use block quotes to write code in your message, enclose it in triple backticks :slight_smile:

3

This works perfect, thanks!

Thx for the tip on code format too!