Announcing Dash Bio 1.0.0 🎉 : a one-stop-shop for bioinformatics and drug development visualizations.

Adding image to Dash board not working

Dear all,
I like to add a heatmap.jpg to a dashboard as I don´t want to recreate a sophisticated sns.heatmap in px due to time constraints.

I import the jpg with
heatmap = io.imread(‘heatmap.png’)

I can´t display it like the other graph objects (histograms, etc) with

dcc.Graph(
id=‘heatmap’,
figure=heatmap,
style={‘width’:‘49’, ‘display’: ‘inline-block’}
)

Errror message is “Invalid argument figure passed into Graph with ID “heatmap”.”

Is dcc.Graph the wrong approach for a jpg?

This is the error message:

(This error originated from the built-in JavaScript code that runs Dash apps. Click to see the full stack trace or open your browser's console.)

propTypeErrorHandler@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:98421:9

CheckedComponent@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:92763:77

renderWithHooks@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:14938:29

mountIndeterminateComponent@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:17617:15

beginWork@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:18731:18

callCallback@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:182:16

invokeGuardedCallbackDev@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:231:18

invokeGuardedCallback@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:286:33

beginWork$1@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:23338:30

performUnitOfWork@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:22292:14

workLoopSync@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:22265:24

performSyncWorkOnRoot@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:21891:11

flushSyncCallbackQueueImpl/<@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:11224:26

unstable_runWithPriority@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react@16.v1_8_3m1606377558.14.0.js:2685:14

runWithPriority$1@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:11174:12

flushSyncCallbackQueueImpl@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:11219:26

flushSyncCallbackQueue@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:11207:5

batchedUpdates$1@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.v1_8_3m1606377558.14.0.js:21997:9

notify@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:88742:12

notifyNestedSubs@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:88815:20

handleChangeWrapper@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:88820:12

dispatch@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:90245:7

createThunkMiddleware/</</<@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:89995:16

dispatch@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:90661:28

apiThunk/<@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:93011:13

createThunkMiddleware/</</<@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:89992:18

componentDidMount/intervalId<@http://127.0.0.1:8050/_dash-component-suites/dash_renderer/dash_renderer.v1_8_3m1606377558.dev.js:96003:21