Dash how to use imshow or Image?

@rangehacked wrote:

Hi,

I’d like to use the newly introduced imshow/Image in a dash application.

In jupyter lab this renders nicely

import plotly.graph_objects as go
img_rgb = [[[255, 0, 0], [0, 255, 0], [0, 0, 255]],
           [[0, 255, 0], [0, 0, 255], [255, 0, 0]]]
fig = go.Figure(go.Image(z=img_rgb))
fig.show()

whereas in dash I only see the empty graph component.

%%writefile app.py

import plotly
import plotly.graph_objects as go
import dash
import dash_html_components as html
import dash_core_components as dcc
from dash.dependencies import Input, Output

print('plotly=', plotly.__version__)
print('dash=', dash.__version__)
print('dash_html_components=', html.__version__)
print('dash_core_components=', dcc.__version__)

app = dash.Dash(
    __name__, external_stylesheets=["https://codepen.io/chriddyp/pen/bWLwgP.css"]
)

img_rgb = [[[255, 0, 0], [0, 255, 0], [0, 0, 255]],
           [[0, 255, 0], [0, 0, 255], [255, 0, 0]]]

app.layout = html.Div(
    [
        html.H1("go.Image"),
        dcc.Graph(id="graph", figure = go.Figure(go.Image(z=img_rgb)), style={"width": "75%", "display": "inline-block"}),
    ]
)

app.run_server(debug=True)

Versions:
plotly= 4.3.0
dash= 1.4.1
dash_html_components= 1.0.1
dash_core_components= 1.3.1

grafik1551×590 11.2 KB

.

I get the same behaviour when I’m trying to pass the plotly.express imshow to dcc.Graph figure. What am I missing?

Posts: 3

Participants: 2

Read full topic