Show a loading symbol while gathering data

Dash Python
21

Okay I am back up and running. I made these adjustments and downloaded dash[diskcache]. I’m still getting this error:

dash.exceptions.MissingLongCallbackManagerError: Running `long` callbacks requires a manager to be installed.
Available managers:
- Diskcache (`pip install dash[diskcache]`) to run callbacks in a separate Process and store results on the local filesystem.
- Celery (`pip install dash[celery]`) to run callbacks in a celery worker and store results on redis.

Do I need to have this on the same page?

    import diskcache
    cache = diskcache.Cache("./cache")
    background_callback_manager = DiskcacheManager(cache)
22

In your app init, you need to also pass the background_callback_manager.

23

So put those imports in app.py?

24

Correct, your app need to have them, not the page.

1 Like
25

Still getting the same error. My app.py looks like this

import dash
import dash_bootstrap_components as dbc
from dash import html, dcc, DiskcacheManager

import diskcache
cache = diskcache.Cache("./cache")
background_callback_manager = DiskcacheManager(cache)

from components import navbar

nav = navbar.navbar()

app = dash.Dash(__name__, use_pages=True,
                external_stylesheets=[dbc.themes.BOOTSTRAP], 
                meta_tags=[{"name": "viewport", "content": "width=device-width"}], 
                suppress_callback_exceptions=True,
                )

app.layout = html.Div([
    dcc.Store(id="store", data={}, storage_type='session'),
    dcc.Store(id='store-results', data={}, storage_type='session'),
    nav,
    dash.page_container,
    ]
)

if __name__ == "__main__":
    app.run_server(
        debug=True, 
        dev_tools_props_check=False, 
        # host='0.0.0.0', 
        # port=5000
        )
26 
app = dash.Dash(__name__, use_pages=True,
                external_stylesheets=[dbc.themes.BOOTSTRAP], 
                meta_tags=[{"name": "viewport", "content": "width=device-width"}], 
                suppress_callback_exceptions=True,
                background_callback_manager=background_callback_manager
                )
27

Now i’m getting

TypeError: cannot pickle '_abc._abc_data' object

I’m going crazy :upside_down_face:

28

Are you on windows?

29

Yes I’m on a windows machine

30

Bring the callback to the app.py.

31

Okay that helped. Now the only thing is the loader is showing before the button click.

1 Like
32

Remove the show_initially on the dls. And pass it children=[], and add an additional output to the dls children and pass it the same [] after it is done.

This should in theory only show it when it is running. :slight_smile:

33

Perfect! I did this and got it!

@app.callback(
    Output('store', 'data'),
    Output('error-alert', 'is_open'),
    Output('graph-redirect', 'pathname'),
    Input('data-button', 'n_clicks'),
    State('engine-drop', 'value'),
    State('start-date', 'value'),
    State('region-drop', 'value'),
    State('report-options', 'value'),
    background=True,
    running =[
        (Output('data-button', 'disabled'), True, False),
        (Output('loading', 'visibility'), True, False),
        (Output('loading', 'children'), False, True)
    ]
)

There’s no way to stop it from flashing on page load is there?

34

prevent_initial_call=True, that should keep it from triggering on initial load. :slight_smile:

35 
@app.callback(
    Output('store', 'data'),
    Output('error-alert', 'is_open'),
    Output('graph-redirect', 'pathname'),
    Input('data-button', 'n_clicks'),
    State('engine-drop', 'value'),
    State('start-date', 'value'),
    State('region-drop', 'value'),
    State('report-options', 'value'),
    background=True,
    running =[
        (Output('data-button', 'disabled'), True, False),
        (Output('loading', 'visibility'), True, False),
        (Output('loading', 'children'), False, True),
    ],
    prevent_initial_call=True
)

This? Still flashing for a second :confused:

36

Did you remove the show_initially=True on the dls in the layout?

37

Yes

        dbc.Row([
            html.Center([
                dbc.Button(
                    'Generate Graph',
                    id='data-button',
                    n_clicks=0,
                    color='secondary',
                    external_link=True,
                ),
            ]),
            dls.Scale(
                id='loading',
                children=[])
        ],
        style={'margin-top': '20px', 'margin-bottom': '30px'}),
38

The button is also disabled initially as well.

39

Do you have any errors?

Maybe remove the line for the visibility.

40

Nope no errors. And the visibility doesn’t make a difference.