4

I've been able to figure out how to update a Plotly graph with new data using buttons. That is, if I select a certain button (say X1 in the example below), the plot will change so that it'll plot that variable, etc.

However, I want to be able to select multiple buttons at once. For example, I want to be able to select X1 and X2 and plot both on the chart.

I haven't been able to make any progress on this, so I was hoping someone could provide some clues on a way forward.

import plotly
import plotly.graph_objs as go
import numpy as np
import pandas as pd

plotly.offline.init_notebook_mode(connected=True)

x0 = np.linspace(0,99,100)
y0 = np.random.normal(2, 0.4, 100)
y1 = np.random.normal(2, 0.4, 100)
y2 = np.random.normal(2, 0.4, 100)

trace0 = go.Scatter(x = x0, y = y0)
trace1 = go.Scatter(x = x0, y = y1, visible = False)
trace2 = go.Scatter(x = x0, y = y2, visible = False)

data = [trace0, trace1, trace2]

button1 = dict(label = 'X0', 
               method = 'update', 
               args = [{'visible': [True, False, False]}])

button2 = dict(label = 'X1', 
               method = 'update', 
               args = [{'visible': [False, True, False]}])

button3 = dict(label = 'X2', 
               method = 'update', 
               args = [{'visible': [False, False, True]}])


updatemenus = list([
    dict(type="buttons", active = 0,
         buttons = [button1, button2, button3], yanchor = 'top')])


layout = dict(title='Chart', showlegend=False,
              updatemenus=updatemenus)                      

fig = dict(data=data, layout=layout)

plotly.offline.iplot(fig)
measure_theory
  • 874
  • 10
  • 28

1 Answers1

0

See this answer for a good example that solves your functional requirements of viewing multiple traces, but doesn't solve the visual aspect of having 2 buttons selected at once.

Essentially, you can make the buttons work like toggles. So when you select one button, it should only affect a subset of traces. To do this, you would pass a single value into 'visible', then pass a list of trace indices that you want the button to affect. You can then use args2 to specify what happens when you deselect a button. So now the button toggles off and on certain traces, as opposed to specifying the visibility of all traces.

So button 1 would be:

button1 = dict(label = 'X0', 
           method = 'restyle', 
           args = [{'visible': True},[0]], args2 = [{'visible': False},[0]])

The downside is that you still only have one button 'selected'. So if you start with all traces drawn (and no buttons selected), this behavior would occur:

  1. Click button2 (X1). Nothing happens because args tells your X1 trace to be visible and it already is. You will notice that button2 now appears active and button1 no longer appears active, though your traces are still showing.
  2. Click button2 (X1) again and you will see X1 disappear. Now no buttons appear selected, but all but your X1 trace should be visible.

I'm not sure how to solve the visual aspect to this yet; but I hope this helps!