Annotated heatmaps: font colour blends with the colour of the square.

[PlatonB]

When using the default color scheme, the font color contrasts normally with the fill of the each heatmap square. But if you try other standard color schemes with reversescale=True, when values are close to zero, the colors will merge. I think this is the wrong default behavior.

[jonmmease]

Hi @PlatonB, thanks for the report.

Could you include a small example, along with the version of plotly.py that you're using? I'm mostly interested in whether you're using 3.4.0+, which includes the fixes from #1251. Thanks!

[PlatonB]

Hello, @jonmmease ! I am using version 3.4.2. An example of the output: https://drive.google.com/file/d/1ISG1TQIqKS5Aj5tEWKlP9QzSuNvxAQK5/view?usp=sharing

[jonmmease]

Thanks for the version info @PlatonB. Could you include a small example? The data itself isn't important, but the way you're specifying your colorscale may be.

[PlatonB]

@jonmmease
Example:
https://github.com/PlatonB/ld_triangle/blob/e8345b615c59c74f9c2581c8f28a16ec318a3ae5/LD_triangle.py#L328
Colorscale used most often to reproduce the error - Greens.

[jonmmease]

Hi @PlatonB,

I don't think I'm able to reproduce what you're seeing. Here's what I tried:

# Imports and data
from plotly.offline import iplot, init_notebook_mode
import plotly.figure_factory as ff
init_notebook_mode()

z = [[.1, .3, .5, .7, .9],  
     [1, .8, .6, .4, .2],
     [.2, 0, .5, .7, .9],  
     [.9, .8, .4, .2, 0],
     [.3, .4, .5, .7, 1]] 

# Standard scale direction
fig = ff.create_annotated_heatmap(z, colorscale='Greens', showscale=True)
iplot(fig)

# Reversed scale direction
fig = ff.create_annotated_heatmap(z, colorscale='Greens', reversescale=True, showscale=True)
iplot(fig)

import plotly
print(plotly.__version__)

3.4.2

Could you try reproducing the issue by starting with this simple example?
-Jon

[PlatonB]

Hello, @jonmmease !
With your data the error was not reproduced.
Figure object with my data:
Contrast_bug_fig_object.txt

[jonmmease]

Hi @PlatonB,

Sorry for not following up on this sooner. If you're still interested in working through this, what we need is an example of the input to the figure factory that causes the issue. Basically, can you start with my example above and then change the z parameter to create_annotated_heatmap so that it reproduces the behavior you're seeing?

[PlatonB]

Hello, @jonmmease
Example of 50x50 input matrix:
https://drive.google.com/file/d/1pzwFEO9-PtjXsqg2wfhS-XIOIWpod_7z/view?usp=sharing

Also, in the previous post I attached an example of a complete Figure object, that contains 30x30 z.

[jonmmease]

Hi @PlatonB, thanks for providing the dataset,

here's what I see using the if I use you're dataset with reversescale=True

# Imports and data
from plotly.offline import iplot, init_notebook_mode
import plotly.figure_factory as ff
import numpy as np
import json
init_notebook_mode()

with open('z.json', 'r') as f:
    z = json.load(f)

# Standard scale direction
fig = ff.create_annotated_heatmap(z, colorscale='Greens', showscale=True, reversescale=True)
fig.layout.width = 1200
fig.layout.height = 1200
iplot(fig)

Which has a lot of overlap, but I think I can make out some pixels with white text that should be black. Here are two subsets of z that show some interesting behavior.

[1:13, 0:8]

# Imports and data
from plotly.offline import iplot, init_notebook_mode
import plotly.figure_factory as ff
import numpy as np
import json
init_notebook_mode()

with open('z.json', 'r') as f:
    z = json.load(f)
    
import numpy as np
sub_z = np.array(z)[1:13, 0:8].tolist()

# Standard scale direction
fig = ff.create_annotated_heatmap(sub_z, colorscale='Greens', showscale=True, reversescale=True)
fig.layout.width = 800
fig.layout.height = 800
iplot(fig)

[1:13, 1:8]

# Imports and data
from plotly.offline import iplot, init_notebook_mode
import plotly.figure_factory as ff
import numpy as np
import json
init_notebook_mode()

with open('z.json', 'r') as f:
    z = json.load(f)
    
import numpy as np
sub_z = np.array(z)[1:13, 1:8].tolist()

# Standard scale direction
fig = ff.create_annotated_heatmap(sub_z, colorscale='Greens', showscale=True, reversescale=True)
fig.layout.width = 800
fig.layout.height = 800
iplot(fig)

The [1:13, 0:8] subset has a pixel on the top right that certainly looks like it should have black text. And if the first column is removed and we look at the [1:13, 1:8] subset then the pixel text is colored black.

So yeah, looks like a bug. Thanks again for the report!

[PlatonB]

Hello, @jonmmease! Bug can be reproduced when using zmin and zmax arguments. Plotly 4.5.0.

from random import triangular
import plotly.figure_factory as ff

z = [[round(triangular(0.01, 0.1), 3) for j in range(10)] for i in range(10)]
ff.create_annotated_heatmap(z, colorscale='greens').show()
ff.create_annotated_heatmap(z, colorscale='greens', zmin=0, zmax=1).show()

Without zmin and zmax:

With zmin=0 and zmax=1:

[rozierguillaume]

I have the same problem!