Sliders

Introductie tot datavisualisatie met Plotly in Python

Alex Scriven

Data Scientist

Wat zijn sliders?

Een interactief element om tussen waarden te schakelen en een plot te updaten
Gebruikt om data in de tijd te bekijken
Kan voor elke groep worden gebruikt

💡 Check of het logisch is in je plot

Een jaarslider:

A year slider

Een pinguïneilanden-slider:

A penguin island slider

Sliders in plotly.express

animation_frame Wat op de slider staat (Year of Island op de vorige slide)

animation_group: Bepaalt welke samples gelijk blijven over frames

Omzet vs. personeel met slider

fig = px.scatter(
  data_frame=revenues, 
  y='Revenue',
  x='Employees',
  color='Industry',

  animation_frame='Year',
  animation_group='Company')


fig.update_layout({
  'yaxis': {'range': [0, 500000]},
  'xaxis': {'range': [-100000, 2500000]}
})


fig['layout'].pop('updatemenus')
fig.show()

Revenues per year

Beperking: animate-methode

plotly.express implementeert sliders met de animate-methode

fig['layout']['sliders'][0].steps[0]['method']

animate

Animeert alleen hetzelfde datapunt in de tijd
Bouw de slider met traces

Ons plan

Maak een figuur met de nodige traces
Definieer een sliders-object om traces te tonen/verbergen
Werk de layout bij en voeg de slider toe

De figuur maken

fig = go.Figure()

for island in ['Torgersen', 'Biscoe', 'Dream']:
    df = penguins[penguins.Island == island]

    temp_trace = px.scatter(df, x="Culmen Length (mm)", y="Culmen Depth (mm)")
    fig.add_trace(temp_trace.data[0])

De slider maken

sliders = [
  {'steps':[

    {'method': 'update', 'label': 'Torgersen',

    'args': [{'visible': [True, False, False]}]},

    {'method': 'update', 'label': 'Bisco',

    'args': [{'visible': [False, True, False]}]},

    {'method': 'update', 'label': 'Dream',

    'args': [{'visible': [False, False, True]}]}

  ]}
]

Meer opmaakopties in de documentatie

De slider toevoegen

fig.update_layout({'sliders': sliders})
fig.show()

Penguin islands slider final

Laten we oefenen!

Introductie tot datavisualisatie met Plotly in Python