✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚡️ Concerned about the grid? Kyle Baranko teaches how to predicting peak loads using XGBoost. Register for the August webinar!

No Dash dislay in JupyterLab

I know that this topic has already appeared here and in other places. I tried to follow couple paths and can not make JupyterLab to display dash apps.

Probably there is some switch I need to turn on but can’t find out what it is and have no idea where else to look. Need some help, please.

Here is how I installed test environment

conda create --name env4 python=3.8 scipy pandas jupyterlab numpy "ipywidgets=7.5" matplotlib dash
conda activate env4
conda install -c conda-forge -c plotly jupyter-dash
ipython kernel install --user --name=env4
jupyter labextension install @jupyter-widgets/jupyterlab-manager plotlywidget@4.12.0
jupyter labextension install jupyterlab-plotly@4.12.0
conda install -c plotly plotly=4.12.0

(last command is there because v4.11 is loaded natively by conda).

Here is my JupyterLab extension list:

        @jupyter-widgets/jupyterlab-manager v2.0.0  enabled  OK
        jupyterlab-dash v0.3.0  enabled  OK
        jupyterlab-plotly v4.12.0  enabled  OK
        plotlywidget v4.12.0  enabled  OK

Here is some code from Dash website as an example of what I can’t display in JupyterLab.

import plotly.graph_objects as go # or plotly.express as px
fig = go.Figure() # or any Plotly Express function e.g. px.bar(...)
# fig.add_trace( ... )
# fig.update_layout( ... )

import dash
import dash_core_components as dcc
import dash_html_components as html
from jupyter_dash import JupyterDash

app = JupyterDash(__name__)

# app = dash.Dash()
app.layout = html.Div([
    dcc.Graph(figure=fig)
])

app.run_server(mode='jupyterlab', port = 8090, dev_tools_ui=True, #debug=True,
          dev_tools_hot_reload =True, threaded=True)

it opens new tab in JupyterLab but tab is blank.
The same when I use mode = inline
but
mode=external produces new tab in browser, as it should.

Sorry for so many words but I’m bit frustrated that I can’t make it work.
At the same time Plotly graphs are displayed properly.
As said, I’ve tried different combinations and none seems to work. Need some ideas what to do. pls.

The most likely cause for above is user.js configuration for my browser.

@Marcas did you end up solving the issue?

Not in details, I had not enough time. I use web browser with tweaked settings, one of those must prevent JupLab from rendering Dash inline (I messed up with that lately for a while). When I use default profile everything seems to be fine, so I assume one or few of browser’s settings are responsible. I can work with external mode of JupyterDash, no problem. Now, when I know where to look if I need to fix that issue I can work more relaxed :slight_smile:

Other issue is still mystery, but this in another post (initial_callbacks).

thanks

1 Like