Plotly - controle deslizante

Plotly tem um conveniente Slider que pode ser usado para mudar a visão de data/style de um gráfico deslizando um botão no controle que é colocado na parte inferior do gráfico renderizado.

Slider control é composta por diferentes propriedades que são as seguintes -

  • steps property é necessário para definir as posições deslizantes do botão sobre o controle.

  • method property está tendo valores possíveis como restyle | relayout | animate | update | skip, o padrão é restyle.

  • args property define os valores dos argumentos a serem passados ​​para o método Plotly definido no método no slide.

Agora implantamos um controle deslizante simples em um gráfico de dispersão que irá variar a frequência de sine waveconforme o botão desliza ao longo do controle. O controle deslizante está configurado para ter 50 etapas. Primeiro adicione 50 traços da curva de onda senoidal com frequência crescente, todos exceto o 10º traço definido como visível.

Em seguida, configuramos cada etapa com restylemétodo. Para cada etapa, todos os outros objetos de etapa têm visibilidade definida parafalse. Por fim, atualize o layout do objeto Figura inicializando a propriedade dos controles deslizantes.

# Add traces, one for each slider step
for step in np.arange(0, 5, 0.1):
fig.add_trace(
   go.Scatter(
      visible = False,
      line = dict(color = "blue", width = 2),
      name = " = " + str(step),
      x = np.arange(0, 10, 0.01),
      y = np.sin(step * np.arange(0, 10, 0.01))
   )
)
fig.data[10].visible=True

# Create and add slider
steps = []
for i in range(len(fig.data)):
step = dict(
   method = "restyle",
   args = ["visible", [False] * len(fig.data)],
)
step["args"][1][i] = True # Toggle i'th trace to "visible"
steps.append(step)
sliders = [dict(active = 10, steps = steps)]
fig.layout.update(sliders=sliders)
iplot(fig)

Começar com, 10th sine waveo traço ficará visível. Tente deslizar o botão no controle horizontal na parte inferior. Você verá a mudança de frequência conforme mostrado abaixo.