Skip to content
This repository has been archived by the owner on Jun 3, 2024. It is now read-only.

Dynamically adding graphs fails when no graph exist before #162

Closed
bperrenoud opened this issue Feb 20, 2018 · 2 comments
Closed

Dynamically adding graphs fails when no graph exist before #162

bperrenoud opened this issue Feb 20, 2018 · 2 comments

Comments

@bperrenoud
Copy link

Using dash-core-components v0.18.1
When trying to add graphs dynamically (each time a button is clicked, a new graph is added), an error appears in the console:

bundle.js?v=0.11.2:9 Uncaught (in promise) Error: dash_core_components was not found.
at Object.resolve (bundle.js?v=0.11.2:9)
at s (bundle.js?v=0.11.2:9)
at Array.map ()
at s (bundle.js?v=0.11.2:9)
at Array.map ()
at s (bundle.js?v=0.11.2:9)
at Array.map ()
at s (bundle.js?v=0.11.2:9)
at e.value (bundle.js?v=0.11.2:9)
at p._renderValidatedComponentWithoutOwnerOrContext (react-dom@15.4.2.min.js?v=0.11.2:13)

The error doesn't show up if a graph has been added when the page loaded. To reproduce:

  • Run the sample code joined to this example
  • Click on the button
  • See the error triggered by bundles.js

Then, uncomment line 12 of ContentController.py and

  • Run the sample code joined to this example
  • Click on the button
  • No error is triggered, the graphs show up

DashTest.zip

@mjclawar
Copy link
Contributor

This is a duplicate of plotly/dash-table-experiments#28 (comment)

It was explained in more detail on the community boards here

A little context: When Dash serves the page, it crawls the app.layout to see which component libraries are being used (e.g. dash_core_components). Then, with this list of unique component libraries, it serves the necessary JS and CSS bundles that are distributed with those component libraries.

In this case, we’re serving dash_table_experiments on a separate page, as the response of a callback. Dash only sees dash_html_components and dash_core_components in the app.layout and so it doesn’t serve the necessary JS and CSS bundles that are required for the dash-table-components component that is rendered in the future.

This is a design flaw of Dash. For now, you can get around this issue by rendering a hidden dash-table-experiments component in the layout like:

app.layout = html.Div([
   html.Div(id='content'),
   dcc.Location(id='location', refresh=False),
   html.Div(dt.DataTable(rows=[{}]), style={‘display’: ‘none’})
])

In this case, you would need to include an empty, hidden graph (or any other dash-core-components Component so that the bundle is included and sent to the client by the Dash application).

@chriddyp
Copy link
Member

Closing in favor of plotly/dash-renderer#46

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants