Toggle trace visibility on and off plotly - python

Question

I'm new to plotly with Python and I have a question. I can't find the solution somewhere else. I want to make buttons to toggle traces on and off in the graph so you can look to traces individually or compare two traces. Here is my code now! Can someone explain to me how this works.

trace =[go.Scatter(x=df["Topic", "Regions", "Periods"], y=df["Price index purchase prices|Price index of existing own homes","Amsterdam", "2010 = 100"],
                   mode='lines+markers',
                   name='Amsterdam',visible=True),
go.Scatter(x=df["Topic", "Regions", "Periods"], y=df["Price index purchase prices|Price index of existing own homes","Rotterdam", "2010 = 100"],
                   mode='lines+markers',
                   name='Rotterdam',visible=True),
go.Scatter(x=df["Topic", "Regions", "Periods"], y=df["Price index purchase prices|Price index of existing own homes","Zuid-Holland (PV)", "2010 = 100"],
                   mode='lines+markers',
                   name='Zuid-Holland',visible=True),
go.Scatter(x=df["Topic", "Regions", "Periods"], y=df["Price index purchase prices|Price index of existing own homes","Noord-Brabant (PV)", "2010 = 100"],
                   mode='lines+markers',
                   name='Noord-Brabant',visible=True),
go.Scatter(x=df["Topic", "Regions", "Periods"], y=df["Price index purchase prices|Price index of existing own homes","Groningen (PV)", "2010 = 100"],
                   mode='lines+markers',
                   name='Groningen',visible=True),
go.Scatter(x=df["Topic", "Regions", "Periods"], y=df["Price index purchase prices|Price index of existing own homes","Nederland", "2010 = 100"],
                   mode='lines+markers',
                   name='Nederland', visible=True)]

layout = go.Layout(
   xaxis=go.layout.XAxis(
       type='category',
       title='Periode'
   ),
   yaxis=go.layout.YAxis(
       title='Prijsindex, 2010 = 100'
   ),
   title="Prijsindex van de huisprijzen in de Randstad"
)

fig = go.Figure(data=trace, layout=layout)
fig.update_layout(
   updatemenus=[
       dict(
           type = "buttons",
           direction = "left",
           buttons=list([
               dict(
                   args=["visible", "False"],
                   label="Amsterdam",
                   method="restyle"
               )
           ]),
           pad={"r": 10, "t": 10},
           showactive=True,
           x=0.0,
           xanchor="left",
           y=1.15,
           yanchor="top"
       ),
   ]
)
fig.show()

Thanks!

You can toggle trace visibility by clicking on traces name in the legend (this is a default behavior). @see https://plotly.com/python/legend/ — EricLavault, Jun 15 '21 at 13:13

score 0 · Answer 1 · answered Jun 15 '21 at 14:23

as per comment, simplest way is to use legend. Clicking on a trace to make it visible / invisible
if you want buttons plotly buttons
you did not provide sample data, so I've generated some and demonstrated how buttons can be used. Note updatemenus is really a static encoding, so dynamic / dependent behaviour can be quite limiting


df = pd.DataFrame({c: np.random.uniform(1, 100, 300) for c in list("ABCDE")})

fig = go.Figure([go.Scatter(x=df.index, y=df[c], name=c) for c in df.columns])
fig.update_layout(
    updatemenus=[
        {
            "type": "buttons",
            "buttons": [
                {
                    "label": c,
                    "method": "update",
                    "args": [
                        {"visible": [c == c2 for c2 in df.columns]}
                    ],
                }
                for c in df.columns
            ]
            + [
                {
                    "label": "All",
                    "method": "update",
                    "args": [{"visible": [1, 1, 1, 1, 1]}],
                }
            ],
        }
    ]
)

Toggle trace visibility on and off plotly - python

1 Answers1