Loading Indicator during plot rendering

📊 Plotly Python
2

Hey @Yokogawa-Akshay welcome to the forums.

You could change the callback to return the figure instead of the dcc.Graph(), this should help.

import dash
from dash import dcc, html, Input, Output
import plotly.express as px
import numpy as np

app = dash.Dash(__name__)

app.layout = html.Div([
    html.Button('Update Plot', id='update-button', n_clicks=0),
    html.Div([
        dcc.Loading(
            id="loading",
            type="default",
            fullscreen=True,
            children=[
                html.Div(id='graph-container'),
                dcc.Graph(id='graph')
            ]
        )
    ])
])


@app.callback(
    # Output('graph-container', 'children'),
    Output('graph', 'figure'),
    [Input('update-button', 'n_clicks')],
    prevent_initial_call=True
)
def update_plot(n_clicks):
    if n_clicks > 0:
        fig = px.scatter(
            x=np.random.randint(1, 100_000, 2_000_000),
            y=np.random.randint(1, 100_000, 2_000_000),
            title='Scatter Plot'
        )
        fig.update_traces(textposition='top center')

        # return dcc.Graph(id='volcano-plot', figure=fig)
        return fig

    # return html.Div()


if __name__ == '__main__':
    app.run_server(debug=True)