Plotly: lista desplegable para agregar botones

Plotly proporciona un alto grado de interactividad mediante el uso de varios controles en el área de trazado, como botones, listas desplegables, controles deslizantes, etc. Estos controles se incluyen en updatemenu atributo de planificación de la parcela. Usted puede botón agregar y su comportamiento especificando el método a invocar.

Hay cuatro métodos posibles que se pueden asociar con un botón de la siguiente manera:

  • remodelación – cambiar datos o atributos de datos

  • relé – cambiar atributos de diseño

  • Actualizar – cambiar datos y atributos de diseño

  • animar – iniciar o pausar la animación

EN remodelación El método debe usarse cuando cambiar datos y atributos de datos grafico. El siguiente ejemplo agrega dos botones Updatemenu () método para diseñar usando remodelación método.

go.layout.Updatemenu(
type = "buttons",
direction = "left",
buttons = list([
   dict(args = ["type", "box"], label = "Box", method = "restyle"),
   dict(args = ["type", "violin"], label = "Violin", method = "restyle" )]
))

Valor un tipo propio botones defecto. Para mostrar la lista desplegable de botones, cambie el tipo a otoño… La traza de Box se agregó a la Figura antes de que se actualizara su diseño como se indicó anteriormente. Código completo que se muestra diagrama de caja y trama de violín dependiendo del botón presionado, se ve así:

import plotly.graph_objs as go
fig = go.Figure()
fig.add_trace(go.Box(y = [1140,1460,489,594,502,508,370,200]))
fig.layout.update(
   updatemenus = [
      go.layout.Updatemenu(
         type = "buttons", direction = "left", buttons=list(
            [
               dict(args = ["type", "box"], label = "Box", method = "restyle"),
               dict(args = ["type", "violin"], label = "Violin", method = "restyle")
            ]
         ),
         pad = {"r": 2, "t": 2},
         showactive = True,
         x = 0.11,
         xanchor = "left",
         y = 1.1,
         yanchor = "top"
      ), 
   ]
)
iplot(fig)

La salida del código se da a continuación:

Botón de violín

Prensa Violín para mostrar el correspondiente Plotly de violín…

Botón desplegable

Como se mencionó anteriormente, el valor un tipo teclear Updatemenu () se asigna el método otoño para mostrar una lista desplegable de botones. La trama se ve así:

Método de actualización

EN Actualizar debe usarse al cambiar datos y secciones del diseño del gráfico. El siguiente ejemplo muestra cómo actualizar y qué trazas se muestran al actualizar los atributos de diseño, como el título del gráfico. Dos pistas Scatter correspondientes onda seno y coseno añadido a Objeto de dibujo… Sendero con visible atributo como Cierto se mostrará en el gráfico y se ocultarán otras trazas.

import numpy as np
import math #needed for definition of pi

xpoints = np.arange(0, math.pi*2, 0.05)
y1 = np.sin(xpoints)
y2 = np.cos(xpoints)
fig = go.Figure()
# Add Traces
fig.add_trace(
   go.Scatter(
      x = xpoints, y = y1, name="Sine"
   )
)
fig.add_trace(
   go.Scatter(
      x = xpoints, y = y2, name="cos"
   )
)
fig.layout.update(
   updatemenus = [
      go.layout.Updatemenu(
         type = "buttons", direction = "right", active = 0, x = 0.1, y = 1.2,
         buttons = list(
            [
               dict(
                  label = "first", method = "update",
                  args = [{"visible": [True, False]},{"title": "Sine"} ]
               ),
               dict(
                  label = "second", method = "update", 
                  args = [{"visible": [False, True]},{"title": Cos"}]
               )
            ]
         )
      )
   ]
)
iplot(fig)

Inicialmente, Sinusoide será mostrado. Si presiona el segundo botón, Huella de cos aparece.

tenga en cuenta que Titulo del gráfico también se actualiza en consecuencia.

Sinusoide

Usar animar método, necesitamos agregar uno o más Marcos de cuadros un objeto. Junto con los datos y la composición, se pueden agregar marcos como clave para un objeto de forma. Los fotogramas clave indican una lista de formas, cada una de las cuales se repetirá cuando comience la animación.

Puede agregar botones de reproducción y pausa para agregar animación a su diagrama agregando matriz updatemenus al diseño.

"updatemenus": [{
   "type": "buttons", "buttons": [{
      "label": "Your Label", "method": "animate", "args": [frames]
   }]
}]

En el siguiente ejemplo curva de dispersión primero se aplica la pista. Luego añade personal que es una lista 50 objetos enmarcados, cada uno de los cuales es marcador rojo en la curva. tenga en cuenta que argumentos el atributo del botón se establece en Ninguno, lo que anima todos los fotogramas.

import numpy as np
t = np.linspace(-1, 1, 100)
x = t + t ** 2
y = t - t ** 2
xm = np.min(x) - 1.5
xM = np.max(x) + 1.5
ym = np.min(y) - 1.5
yM = np.max(y) + 1.5
N = 50
s = np.linspace(-1, 1, N)
#s = np.arange(0, math.pi*2, 0.1)
xx = s + s ** 2
yy = s - s ** 2
fig = go.Figure(
   data = [
      go.Scatter(x = x, y = y, mode = "lines", line = dict(width = 2, color = "blue")),
      go.Scatter(x = x, y = y, mode = "lines", line = dict(width = 2, color = "blue"))
   ],
   layout = go.Layout(
      xaxis=dict(range=[xm, xM], autorange=False, zeroline=False),
      yaxis=dict(range=[ym, yM], autorange=False, zeroline=False),
      title_text="Moving marker on curve",
      updatemenus=[
         dict(type="buttons", buttons=[dict(label="Play", method="animate", args=[None])])
      ]
   ),
   frames = [go.Frame(
      data = [
            go.Scatter(
            x = [xx[k]], y = [yy[k]], mode = "markers", marker = dict(
               color = "red", size = 10
            )
         )
      ]
   )
   for k in range(N)]
)
iplot(fig)

La salida del código se da a continuación:

Botón de play

El marcador rojo se moverá a lo largo de la curva cuando se presione tocar botón.

En Este Curso

🚫