How to deal with Heatmap NaN value

📊 Plotly Python
1

I have successfully using x, y, z value to create a heatmap. However, in my data, some have x, y value but did not have a corresponding Z value, then the heatmap graph just shows NaN and the graph does not look pretty (seems like a gap). How should I fix it? Should I add custom Nan color layer? I have tried to fill the df nan with 0, this did not work.
Thank you!

graph
graph786×423 30.5 KB

1 Like
2

Hi @claire612

Why filling the NaN values with cero didn’t work ? :thinking:

3

The original df does not have this row. When heatmap do the x, y, axis, not all Z axis has value from the x, y. Therefore I need to manully create an empty row for z to match x, y and fill it with 0.
For example
x y z
jan communication 0.5
feb communication NaN
Thats because in the original dataframe, there is no row for “feb, communications”

4

Sorry, I still confuse :thinking:

You can’t create a temporary/intermediate df that has a z column where any NaN value is transformed in ceros ? And then send this df to the heatmap graphic :thinking:

5

yeah if I need to create an intermediate df, I need to recreate a new df and repopulate the df again based on the available x and y values.
I did a quick fix by adding a white background to the graph, seems better than before. I was looking for a way to color the z value with NaN to another color. or add another trace for it. There if no NAN value within the actual df itself.
and I do not want to mess up the NaN value to simply replace 0 since there are negative or 0 value.

Thanks Eduardo for your help!

1 Like
6

I found a clever way to solve this issue: Since the blanks are transparent, the NaN fields show the background color of the plot. So if you set the plot background color to your NaN color, then problem solved. Below is an example with grey background.

import plotly.graph_objects as go

fig = go.Figure(
data=go.Heatmap(
data=[your data goes here]
),
layout=go.Layout(
plot_bgcolor=’#777777’
)

2 Likes
7

This seems to be the most implied solution. However, it just doesn’t completely avoid the gridlines showing over the nan-valued cells, when using px.imshow for the plot:

image
image671×670 5.23 KB

Applying the following does:

    fig.update_xaxes(showgrid=False)
    fig.update_yaxes(showgrid=False)

So now, both the color, and the property of not having gridlines, in nan cells, can be controlled!