Learn how to use Dash Bio for next-gen sequencing & quality control. 🧬 Register for the Oct 27 webinar.

How to deal with Heatmap NaN value

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!

Hi @claire612

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

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”

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:

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

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
)