Plotly Dropdown List

📊 Plotly Python
1

I’m trying to create an interactive dashboard similar to what is shown in the 2nd example here, but I can’t get it to update the dashboard using the dropdown list

import pandas as pd
import plotly.offline as off
off.init_notebook_mode(connected=False)


df = pd.DataFrame({'col1': ['Product A','Product A','Product A','Product B','Product B','Product B','Product C','Product C','Product C'], 'col2': [3,5,2,1,3,1,2,3,2], 
               'col3': ['Client X','Client Y','Client Z','Client X','Client Y','Client Z','Client X','Client Y','Client Z']})


Product = df['col1']
Quantity = df['col2']
Client = df['col3']

aggs = df['col3'].unique()

agg = []
agg_func = []
for i in range(0, len(aggs)):
agg = dict(
    args=['transforms[0].value',aggs[i]],
    label=aggs[i],
    method='restyle'
)
agg_func.append(agg)



plot_data = [dict(
  type = 'bar',
  x = Product,
  y = Quantity,
  mode = 'markers',
  transforms = [dict(
type = 'aggregate',
groups = Product,
aggregations = [dict(
    target = 'y', func = 'sum', enabled = True)
]
  )]
)]

layout = dict(
  title = '<b>Plotly Aggregations</b><br>use dropdown to change aggregation',
  xaxis = dict(title = 'Product',autorange = True),
  yaxis = dict(title = 'Quantity',autorange = True),
  updatemenus = [dict(
    x = 0.85,
    y = 1.15,
    xref = 'paper',
    yref = 'paper',
    yanchor = 'top',
    active = 1,
    showactive = False,
    buttons = agg_func
  )]
)

off.iplot({'data': plot_data,'layout': layout}, validate=False)

Your help is much appreciated

2

Hi @Mike_416,

I think to get what you want you would need to add a second transform to filter by the contents of the dropdown. See https://plot.ly/python/multiple-transforms/#filter-and-aggregate for an example of combining an aggregate and filter transform.

Another option (and the one I prefer) would be to precompute the filters and aggregates using pandas, and then have the dropdown perform a restyle to update the y property of the trace.

Hope that helps!

-Jon

3

and then have the dropdown perform a restyle to update the y property of the trace.

Hey @jmmease, could you give an example on how to do this?

I have two dataframes, one with hourly values over a year and the other with daily values, and would like to have a dropdown menu from which I could select which dataframe to use for plotting.