# dcc.Loading graph runs callback function every single time

**URL:** <https://community.plotly.com/t/dcc-loading-graph-runs-callback-function-every-single-time/65934>\
**Category:** Dash Python\
**Created:** [July 10, 2022, 6:57pm UTC](https://community.plotly.com/t/dcc-loading-graph-runs-callback-function-every-single-time/65934 "2022-07-10T18:57:40Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![keval](https://avatars.discourse-cdn.com/v4/letter/k/ec9cab/32.png) [@keval](https://community.plotly.com/u/keval)\
**Post date:** [July 10, 2022, 6:57pm UTC](https://community.plotly.com/t/dcc-loading-graph-runs-callback-function-every-single-time/65934/1 "2022-07-10T18:57:40Z")

</div>

I have a `dcc.Graph` component that is wrapped around `dcc.Loading`.

layout = html.Div([

```
            dcc.Loading(
                id = "map--load",
                type = "default",
                className = "map-load",
                fullscreen=False,
                children=dcc.Graph(id="map-graph1", className="map-graph1"),
            ),

           dbc.Button(id='cbutton')

```

])

The graph component is a `scattermapbox` and every time a user interacts with the map, for ex. to `zoom`, it runs the callback which is time consuming as it has several operations and function calls.

This results in poor user experience as user sees the loading bar for 20-odd seconds when they zoom in/out. Here’s the callback:

```auto
@application.callback([

                          Output("map-graph1", "figure")

                      ],
                      [

                          Input("cbutton", "n_clicks"),
                          Input("map-graph1", "relayoutData")

                      ],
                 
             )
def update_graph(n_clicks, mapdata):

       if n_clicks:
           # set of operations 

       return figure

```

The user has clicked the button in the past, so if condition evaluates as True. How do I prevent this callback from running every time there is a interaction with the map?

---

<div class="post-metadata">

**Author:** ![AnnMarieW](https://avatars.discourse-cdn.com/v4/letter/a/ec9cab/32.png) [@AnnMarieW](https://community.plotly.com/u/AnnMarieW)\
**Post date:** [July 10, 2022, 8:24pm UTC](https://community.plotly.com/t/dcc-loading-graph-runs-callback-function-every-single-time/65934/2 "2022-07-10T20:24:13Z")

</div>

Hi @keval

You can use `ctx.triggered_id` to see which input triggered the callback. See more information here:

> **[Determining Which Callback Input Changed | Dash for Python Documentation |...](https://dash.plotly.com/determining-which-callback-input-changed)**
>
> Understanding callback context and determining which input triggered a callback

---

<div class="post-metadata">

**Author:** ![yanboe](https://avatars.discourse-cdn.com/v4/letter/y/a6a055/32.png) [@yanboe](https://community.plotly.com/u/yanboe)\
**Post date:** [July 11, 2022, 6:54am UTC](https://community.plotly.com/t/dcc-loading-graph-runs-callback-function-every-single-time/65934/3 "2022-07-11T06:54:05Z")

</div>

Why do you need

```auto
Input("map-graph1", "relayoutData")

```

if you don’t want to fire the callback on Zoom/Relayout?

---

<div class="post-metadata">

**Author:** ![keval](https://avatars.discourse-cdn.com/v4/letter/k/ec9cab/32.png) [@keval](https://community.plotly.com/u/keval)\
**Post date:** [July 11, 2022, 2:40pm UTC](https://community.plotly.com/t/dcc-loading-graph-runs-callback-function-every-single-time/65934/4 "2022-07-11T14:40:27Z")

</div>

I need to adjust zoom settings. There are certain operations in the callback that I don’t want to run.

I ended up using `ctx.triggered` to check for what’s changed as @AnnMarieW suggested.
