predict-idlab
Django support (django-plotly-dash library)
How does this library integrate with Django?
(Issue indicated by @thanosam in #45)
I tried to integrate it in Django but I receive the following error:
_File ".../python3.9/site-packages/plotly_resampler/figure_resampler/figure_resampler.py", line 211, in register_update_graph_callback
app.callback(
File ".../lib/python3.9/site-packages/django_plotly_dash/dash_wrapper.py", line 345, in wrap_func
func.expanded = DjangoDash.get_expanded_arguments(func, inputs, state)
AttributeError: 'method' object has no attribute 'expanded'_
Part of the code below:
...
date_rng = pd.date_range(start='1/1/2018', end='3/1/2018', freq='S')
df = pd.DataFrame(date_rng, columns=['date'])
df['data'] = np.random.randint(0, 100, size=(len(date_rng)))
fig = FigureResampler(go.Figure())
fig.add_trace(go.Scattergl(name='Timestamps', showlegend=True), hf_x=date_rng, hf_y=df['data'])
app = DjangoDash({myappname}) ##
app.layout = html.Div([
dcc.Graph(id="graph-id", figure=fig),
trace_updater.TraceUpdater(id="trace-updater", gdID="graph-id"),
])
fig.register_update_graph_callback(app, "graph-id", "trace-updater") ##
...
So here because we are in Django our app = DjangoDash(....... and not app=Dash(.... .
What causes the error is the register_update_graph_callback, which seems to be incompatible with the django-plotly-dash library.
Any ideas ?
Hi @thanosam!
Yesterday I played around a little with the examples from the django-plotly-dash repo and got to the point where everything seemed to run/work except the sockets of TraceUpdater. (so the graph was not loaded /updated)
For me it seemed that I could not rely on the register_updat_graph_callback method and needed to implement it this way:
# I support liveOut should be "app" in your use-case
@liveOut.callback(
dash.dependencies.Output("trace-updater", "updateData"),
dash.dependencies.Input("graph-id", "relayoutData"),
prevent_initial_call=True,
)
def update(relayout):
return fig.construct_update_data(relayout)
Maybe this can help you further.
Please let us know if you have any update about this issue! This might also help others!
Hi @jvdd !
Thank you for your fast answer. My pleasure to share with the community my findings. I will try it and I will let you know. Fyi I am using the django-plotly-dash library, not the django-dash but I guess your proposal applies the same :)
I had the same issue. Everything seems to work fine except the sockets so when I zoom the graph doesn't update
Hi @thanosam,
My bad, I made a typo! I indeed use the django-plotly-dash repo and adjusted my above comment accordingly.
My first guess would be that sockets are in some way (pre)configurable with django; and you need to configure them properly to integrate successively?
Maybe this blogpost can help? https://medium.com/geekculture/a-beginners-guide-to-websockets-in-django-e45e68c68a71
Following this tutorial I manage to handle dash @app.callbacks in Django: https://www.youtube.com/watch?v=psvU4zwO3Ao&t=2615s&ab_channel=PipInstallPython
In the simpleexample.py file I replaced the content as follows:
app = DjangoDash('SimpleExample')
x = np.arange(5_000_000)
noisy_sin = (3 + np.sin(x / 200) + np.random.randn(len(x)) / 10) * x / 1_000
fig = FigureResampler(go.Figure())
fig.add_trace(go.Scattergl(name='noisy sine', showlegend=True), hf_x=x, hf_y=noisy_sin)
app.layout = html.Div([
dcc.Graph(id="graph-id", figure=fig),
trace_updater.TraceUpdater(id="trace-updater", gdID="graph-id"),
])
@app.callback(Output("trace-updater", "updateData"),[Input("graph-id", "relayoutData")],prevent_initial_call=True,)
def update(relayout):
return fig.construct_update_data(relayout)
Now, I see the 'Loading...' in the plot for a sec and then nothing. :/
The problem seems to be in this line: trace_updater.TraceUpdater(id="trace-updater", gdID="graph-id"),
I work with serve_locally=False, trace-updater==0.0.8, plotly-resampler==0.7.2.1, plotly==5.8.2, dash==2.5.1, dash-core-components==2.0.0, dash-html-components==2.0.0, dash-renderer==1.9.1, dash-table==5.0.0, Django==3.2, django-plotly-dash==1.6.3
The error in the console:
Error: trace_updater was not found. Pn https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 ou https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 uu https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 uu https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 uu https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 iu https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 os https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 React 11 react-dom.production.min.js:125:24 React 24 Uncaught Error: trace_updater was not found. Pn https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 ou https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 uu https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 uu https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 uu https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 iu https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 os https://unpkg.com/[email protected]/build/dash_renderer.min.js:2 React 11
Any ideas please?
Hi @jonasvdd,
I am facing the same problem as @thanosam. Any updates on this issue? :)
Going through the described issue, I got to the same result as @thanosam using his example.
After collecting the static files with Django, the code worked just fine. This added the missing trace_updater.min.js (among others) to your static files location.
If you run Django behind NGINX inside Docker, make sure that all static files are accessible from or copied into the NGINX-Image.
Hope it helps!
Thanks! This got it working for me.
How did you get django to collect trace_updater.min.js? I had to manually copy it into a static directory in my app with the correct plotly file path (dash/component/trace_updater) for it to work. Not a great workaround. Thought about referencing the site-packages directory in my STATICFILES_PATHS settings, but that seemed like a workaround too.
