Dropdown with N datasets and creating buttons

📊 Plotly Python
1

Hi guys, I am completely new in Plotly. I find it very interesting, but I got completely confused when creating a drop-down menu, where each button has two or more traces.

I was able to create traces, but I am not really sure how to create buttons and drop down menu.

import plotly
import plotly.graph_objs as go
import random
import json

def create_plot():

names = ['One', 'Two', 'Three']

x = [x for x in range(20)]

data = {}

for i in names:
    
    y0 = [random.randint(0,100) for x in range(20)]
    y1 = [random.randint(0,100) for x in range(20)]
    
    trace1 = go.Scatter(x=x,y=y0,line=dict(shape='vh'))
    trace2 = go.Scatter(x=x,y=y1,line=dict(shape='vh'))
    
    data[i] = [trace1,trace2]


    
#creating dropdown menu and buttons
''''updatemenus = list([
    dict(active=0 now what?''

Could any help me to understand how to create buttons properly, so when I would select a dropdown button, e.g. “Three” and it would plot the traces from data dictionary. I would appreciate it

2

Hi @MalikaBanalika, welcome to the forums!

Here’s an example adapted from a similar slider example I made a while back (See Multiple traces with a single slider in plotly).

import plotly.graph_objs as go
from plotly.offline import init_notebook_mode, iplot
init_notebook_mode()

num_steps = 3
trace_list1 = [
    go.Scatter(y=[1, 2, 3], visible=True, line={'color': 'red'}),
    go.Scatter(y=[3, 1, 1.5], visible=False, line={'color': 'red'}),
    go.Scatter(y=[2, 2, 1], visible=False, line={'color': 'red'})
]

trace_list2 = [
    go.Scatter(y=[1, 3, 2], visible=True, line={'color': 'blue'}),
    go.Scatter(y=[1.5, 2, 2.5], visible=False, line={'color': 'blue'}),
    go.Scatter(y=[2.5, 1.2, 2.9], visible=False, line={'color': 'blue'})
]

fig = go.Figure(data=trace_list1+trace_list2)

buttons = []
for i in range(num_steps):
    # Hide all traces
    button = dict(
        method='restyle',  
        args=['visible', [False] * len(fig.data)],
        label=i
    )
    # Enable the two traces we want to see
    button['args'][1][i] = True
    button['args'][1][i+num_steps] = True
    
    # Add button to buttons list
    buttons.append(button)

fig.layout.updatemenus = [{'buttons': buttons}]

iplot(fig, show_link=False)

dropdown_multi_trace
dropdown_multi_trace.gif782×407 96.9 KB

Hope that helps!
-Jon

2 Likes
3

Hi @Jmmaese,

Thank you. This really solves the problem. I appreciate it.

1 Like