Plotly Express- Heatmap Colors

Hi.
I have been using Plotly Express and I must say, it’s amazing to work with.

I was generating a heat map from my DataFrame and wanted to change the colour scale. But it didn’t work when I deployed it in my Dash app. It does show the default blue-pink heat map but doesn’t change to the Tealrose scale.

Here is the code:

heatmap1=px.density_heatmap(
df,
x='Issued Date',
y='Books Category',
color_continuous_scale=px.colors.diverging.Tealrose
)

Is there any way to fix this problem? Thank you.

I’m glad you like it so far! The behaviour you’re describing is very strange… It happens only in a Dash app and not in a notebook, say? This could be a question of versioning, whereby the version of plotly.js that Dash is using is lower than the version of plotly.js that Plotly.py/Plotly Express is expecting. If you open the Javascript console and type Plotly.version what do you see?

1 Like

Hey! Thank you for replying.

I checked the version on my python console and the version of Plotly is 3.10.0. I have no idea how to do that on javascript though (I’m new to programming actually).

Can you please tell me how to fix this? Thank you

Oh ok, no problem. I think this is something we have to fix in the next verison of Dash, which should come out very soon :slight_smile:

Hi. Is it a bug or is it something I might be doing wrong?

Hi! I checked once again. The colorscale appears just fine when I run on Jupyter notebook. But it doesn’t change when I run it using IDLE, which is what I normally use for Python coding.

Could the bug be because of IDLE?

Please let me know. Thank you.

Hmm, so some IDEs like Visual Studio and maybe IDLE (I don’t know that one!) have a built-in older version of Plotly.js which is not compatible with the newer versions of Plotly Express…

@jmmease does that sound plausible in this case?

I’m not very familiar with IDLE. @dave1, could you share a screenshot of how you’re displaying a plotly figure with IDLE?

-Jon

If I write a simple code to make a Plotly figure on IDLE, it doesn’t work, but if I write it on a Dash app it does. So, I doubt Plotly figures even run on IDLE.

I am having the same issue as dave’s original issue. Plotly Express lets me set the color in Jupyter Notebook, but it ignores the color specification when in the Dash context.

Jupyter Notebook
ipynb_colors

Dash
dash_colors

These both use the same exact code:

ar_heatmap = px.density_heatmap(
    ar_data, x='BalanceBins', y='PtpBins', 
    category_orders={'BalanceBins':BalanceBinsLabels, 'PtpBins':PtpBinsLabels[::-1]},
    color_continuous_scale=['#fffdc9', '#7e0327']
)
ar_heatmap # in Jupyter Notebook or..
return ar_heatmap # ..in Dash

Plotly seems seem up to date

Edit: @jmmease @nicolaskruchten