dcc.Loading still showing when returning dash.no_update in callback

Hello,

I have a dcc.Loading() which contains a graph. This graph is updated through some user interactions but also through a dcc.Interval().

The issue comes when I sometimes need to ignore the callback if it’s triggered by the dcc.Interval(). Which I do by filtering the callback trigger and returning dash.no_update in a specific case.

However, the dcc.Loading animation still displays at each interval and the graph flickers even though I am returning dash.no_update

Here is a simplified sample code of what I have:

Layout

        dcc.Interval(
            id = 'graph-update',
            interval = 4000,
        ),
        dcc.Loading(
            id = "loading",
            children=[
                dcc.Graph(
                    id = 'plot',
                ),
            ]
        ),

Callback

        @app.callback(
            [
                Output('plot', 'figure'),
            ],
            [
                Input('graph-update', 'n_intervals')
            ],
            [
                State('plot', 'figure'),
            ],
        )
        def update(self, n, figure):

            ctx = dash.callback_context
            trigger_id = ctx.triggered[0]["prop_id"].split(".")[0]

            if (trigger_id == 'graph-update'):
                # raise dash.exceptions.PreventUpdate
                return dash.no_update

            return [figure]

How can I stop the dcc.Loading() component from showing when the callback function returns dash.no_update?

I have also tried raising an exception instead of returning dash.no_update but the result is the same.

Thank you

1 Like

You use a serverside callback which induces delay due to communication between the client (probably your browser) and the server your dash app runs on. The loading animation will show for as long as your client needs to receive the no_update.

1 Like

I am having the same problem, but I am using PreventUpdate. Is there any way to get rid of this Loading delay? For example by having some kind of condition before showing the loading component?