# \[Solved\] How to update different figures with different dropdown values

**URL:** <https://community.plotly.com/t/solved-how-to-update-different-figures-with-different-dropdown-values/4568>\
**Category:** Dash Python\
**Created:** [June 22, 2017, 11:20am UTC](https://community.plotly.com/t/solved-how-to-update-different-figures-with-different-dropdown-values/4568 "2017-06-22T11:20:40Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![carlottanegri](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/carlottanegri/32/1261_2.png) [@carlottanegri](https://community.plotly.com/u/carlottanegri)\
**Post date:** [June 22, 2017, 11:20am UTC](https://community.plotly.com/t/solved-how-to-update-different-figures-with-different-dropdown-values/4568/1 "2017-06-22T11:20:40Z")

</div>

I have two dcc.Graph objects and two dcc.Dropdown in two different Divs: to update the graphs I have 2 callbacks and relative functions:

@app.callback(  
dash.dependencies.Output(‘countsbyfield-graph’, ‘figure’),  
[dash.dependencies.Input(‘field-dropdown-a’, ‘value’)])  
def update\_output\_div\_a(selectedcol):  
…

@app.callback(  
dash.dependencies.Output(‘countsbydate-graph’, ‘figure’),  
[dash.dependencies.Input(‘field-dropdown-b’, ‘value’)])  
def update\_output\_div\_b(selectedcol):

groupbyselcol = dfdate.groupby([selectedcol])[‘[PIT.ID](http://PIT.ID)’].agg(lambda x:len(x.unique()))  
unstacked = dfdate.groupby([“date”,selectedcol])[‘[PIT.ID](http://PIT.ID)’].agg(lambda x:len(x.unique())).unstack().reset\_index()  
print unstacked[‘Herdla’]  
cmap = plt.cm.get\_cmap(‘Dark2’, groupbyselcol.shape[0])  
colors = []  
for i in range(cmap.N):  
rgb = cmap(i)[:3] # will return rgba, we take only first 3 so we get rgb  
colors.append(matplotlib.colors.rgb2hex(rgb))

```
listoftraces = []
for i in range(0,groupbyselcol.shape[0]) :
    value = groupbyselcol.reset_index()[selectedcol][i]
    trace = go.Bar(x=unstacked["date"],y=unstacked[value],name=value,marker=dict(color = colors[i]))
    listoftraces.append(trace)

return {
    'data': listoftraces,
    'layout': go.Layout(
        plot_bgcolor = appcolors['background'],
        paper_bgcolor = appcolors['background'],
        barmode='stack',
        font=dict(
            family='Cabin, monospace',
            color='#7f7f7f'
        ),
        #title='Counts by ' + selectedcol + ' limited to Arter = Salmo Salar, repings in all years of all years marking data ',
        xaxis=dict(
            title=selectedcol,
            tickangle = 30,
            titlefont=dict(
                size=18,
                color='#7f7f7f'
            )
        ),
        yaxis=dict(
            title='unique PIT.IDs counts',
            titlefont=dict(
                size=18,
                color='#7f7f7f'
            ),
            type='log',
        ),
        margin=go.Margin(
            b=150,
            t=100,
            l=100
        )
    )# end layout
}
```

---

<div class="post-metadata">

**Author:** ![chriddyp](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/chriddyp/32/16855_2.png) [@chriddyp](https://community.plotly.com/u/chriddyp)\
**Post date:** [June 22, 2017, 10:43pm UTC](https://community.plotly.com/t/solved-how-to-update-different-figures-with-different-dropdown-values/4568/2 "2017-06-22T22:43:00Z")

</div>

> [@carlottanegri](#):
>
> @app.callback(  
> dash.dependencies.Output(‘countsbyfield-graph’, ‘figure’),  
> [dash.dependencies.Input(‘field-dropdown-a’, ‘value’)])  
> def update\_output\_div\_a(selectedcol):  
> …
> 
> @app.callback(  
> dash.dependencies.Output(‘countsbydate-graph’, ‘figure’),  
> [dash.dependencies.Input(‘field-dropdown-b’, ‘value’)])  
> def update\_output\_div\_b(selectedcol):

It looks like you’re on the right track! Did this not work for you? Check out the second chapter of the user guide at [Part 2. Basic Callbacks | Dash for Python Documentation | Plotly](https://plot.ly/dash/getting-started-part-2) for a few examples with multiple inputs and multiple outputs.

---

<div class="post-metadata">

**Author:** ![carlottanegri](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/carlottanegri/32/1261_2.png) [@carlottanegri](https://community.plotly.com/u/carlottanegri)\
**Post date:** [June 23, 2017, 6:15am UTC](https://community.plotly.com/t/solved-how-to-update-different-figures-with-different-dropdown-values/4568/3 "2017-06-23T06:15:10Z")

</div>

I managed to do it, but apparently I am not understanding how variables inside the defined functions are accessed: apparently they must have unique names, not dummy names shared between functions… or is it so? for example, can you have:

def update\_output\_div\_a(selectedcol):  
df=df[df[‘selectedcol’]  
return df

def update\_output\_div\_b(selectedcol):  
df=df[df[‘selectedcol’]  
return df

? seems like no

---

<div class="post-metadata">

**Author:** ![chriddyp](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/chriddyp/32/16855_2.png) [@chriddyp](https://community.plotly.com/u/chriddyp)\
**Post date:** [June 23, 2017, 2:03pm UTC](https://community.plotly.com/t/solved-how-to-update-different-figures-with-different-dropdown-values/4568/4 "2017-06-23T14:03:08Z")

</div>

> [@carlottanegri](#):
>
> I am not understanding how variables inside the defined functions are accessed:
> 
> ```
> def update_output_div_a(selectedcol):
> df=df[df['selectedcol']
> return df
> 
> def update_output_div_b(selectedcol):
> df=df[df['selectedcol']
> return df
> 
> ```

The variables inside the functions can have whatever names you assign them. `selectedcol` can be used as the variable or input argument in multiple functions. One thing that looks off in your example is this: `df=df[df['selectedcol']]`. If `selectedcol` is a variable, then you should just do `df[selectedcol]` (no strings around it). Also, try to avoid re-assigning the same variable inside the function: instead of `df=df[...]` do something like `dff=df[...]`.

Hope that helps!

---

<div class="post-metadata">

**Author:** ![carlottanegri](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/carlottanegri/32/1261_2.png) [@carlottanegri](https://community.plotly.com/u/carlottanegri)\
**Post date:** [June 27, 2017, 7:48am UTC](https://community.plotly.com/t/solved-how-to-update-different-figures-with-different-dropdown-values/4568/5 "2017-06-27T07:48:27Z")

</div>

yeah sorry of course I meant df=df[df[selectedcol] without quotes…  
also of course the variables inside the function can indeed have whatever names, dumb from my part to even think the opposite…  
my problem was probably as you say in re-assigning something wrongly inside the function, solved anyway. thanks!