8.2.2 Gráficas 2D interactivas - matplotlib.widgets

[ algoritmo ] [ ejemplos ]

Para mostrar el uso de una variable en una función matemática, se puede usar las gráficas interactivas. La librería Matplotlib dispone de los componentes que permiten seleccionar valores de manera dinámica y ajustar la gráfica 2D sin tener que detener y volver a ejecutar el algoritmo.

coseno Interactivo 01Si ya conoces cómo realizar la gráfica para una función senoidal y quieres observar el efecto de cambiar el valor de la amplitud de forma interactiva puedes usar una barra de desplazamiento.

grafica 2D interactivas Sin()

La barra se conoce como Slider que se encuentra en matplotlib.widgetsy requiere dos partes:grafica 2Di nteractivas slider

  • definir la barra
  • actualizar valores

Por ejemplo, para interactuar con la amplitud se define ampl_slider como una barra ubicada en amp_donde, con etiqueta 'ampl', valor mínimo 0.2 y valor máximo y_max. Los cambios de valor al desplazar la barra de determinan con valstep, para este caso con pasos de 0.1.

La variable se inicializa con el valor dado en freq y se dibuja en sentido 'vertical'.

# amplitud slider amp_donde, [x,y,ancho,alto]
ampl_donde = plt.axes([0.1, 0.25, 0.03, 0.65])
ampl_slider = Slider(ampl_donde, 'ampl', 0.2, y_max,
                     valinit=ampl, valstep = 0.1,
                     orientation='vertical')

Para cambiar los valores cuando se desplaza la barra o Slider, se crea un procedimiento de actualización de gráfica grafico_actualiza(). Se obtiene el valor de la variable ampl desde ampl_slider.val. Se actualiza los valores de la función fi que actualiza la linea del gráfico y que finalmente actualiza la figura. Para relacionar los cambios generados por el Slider con la gráfica se define ampl_slider.on_changed(grafico_actualiza)

def grafico_actualiza(val):
    ampl = round(ampl_slider.val,1) # un decimal
    fi = fx(ampl,freq,fase,ti) # actualiza valores de f(x)
    linea.set_ydata(fi) # redibuja linea
    fig.canvas.draw_idle() # actualiza figura

Para añadir los cambios en los parámetros de frecuencia y fase, se repite el proceso de crear un Slider en el intervalo [0,2π].

Para restaurar la gráfica al valor inicial dado en amplitud, frecuencia y fase se usa un botón boton_rst , donde se reinicia las barras creadas.

# boton reinicio de gráfica [x,y,ancho,alto]
boton_rstdonde = plt.axes([0.8, 0.025, 0.1, 0.04])
boton_rst = Button(boton_rstdonde, 'Reset',
                   hovercolor='0.975')
def grafico_reinicia(event):
    ampl_slider.reset()
    return()
    
boton_rst.on_clicked(grafico_reinicia)

[ algoritmo ] [ ejemplos ]
..


1. Algoritmo en Python

Se adjunta el algoritmo en Python integrado

# Señales continuas: senoidal
# gráfica interactiva con Slider
import numpy as np
import matplotlib.pyplot as plt
from matplotlib.widgets import Slider, Button

# INGRESO
ampl = 2.0
freq = 1.0
fase = 0.0
fx = lambda ampl,freq,fase,t: ampl*np.sin(2*np.pi*freq*t+fase)

a = 0 #intervalo [a,b]
b = 1
muestras = 61

y_max = 6.0 # rango vertical
y_min = -y_max
DosPi = 2*np.pi

# PROCEDIMIENTO
ti = np.linspace(a, b, muestras)
fi = fx(ampl,freq,fase,ti)
# SALIDA

# GRAFICA
fig, graf = plt.subplots()
linea, = plt.plot(ti, fi)
titulo = str(ampl)+'*sin(2*pi*'+str(freq)+'*t+'+str(fase)+')'
plt.title(titulo)
plt.grid()

plt.axis([a, b, y_min, y_max])  # cotas gráfico
plt.tight_layout()
plt.subplots_adjust(left=0.25, bottom=0.25) # espacios

# slider: barras para valores 
# amplitud slider amp_donde, [x,y,ancho,alto]
ampl_donde = plt.axes([0.1, 0.25, 0.03, 0.65])
ampl_slider = Slider(ampl_donde, 'ampl', 0.2, y_max,
                     valinit=ampl, valstep = 0.1,
                     orientation='vertical')
# frecuencia slider [x,y,ancho,alto]
freq_donde = plt.axes([0.25, 0.15, 0.65, 0.03])
freq_slider = Slider(freq_donde, 'freq',
                     0.1, np.round(DosPi,1),
                     valinit=freq, valstep = 0.1)
# fase slider [x,y,ancho,alto]
fase_donde = plt.axes([0.25, 0.1, 0.65, 0.03])
fase_slider = Slider(fase_donde, 'fase',
                     0.0, np.round(DosPi,1),
                     valinit=fase, valstep = 0.1,)

def grafico_actualiza(val):
    ampl = round(ampl_slider.val,1) # un decimal
    freq = round(freq_slider.val,1) # un decimal
    fase = round(fase_slider.val,1) # un decimal
    fi = fx(ampl,freq,fase,ti) # actualiza valores de f(x)
    linea.set_ydata(fi) # redibuja linea
    titulo = str(ampl)+'*sin(2*pi*'+str(freq)+'*t+'+str(fase)+')'
    graf.set_title(titulo)
    fig.canvas.draw_idle() # actualiza figura

ampl_slider.on_changed(grafico_actualiza)
freq_slider.on_changed(grafico_actualiza)
fase_slider.on_changed(grafico_actualiza)

# boton reinicio de gráfica [x,y,ancho,alto]
boton_rstdonde = plt.axes([0.8, 0.025, 0.1, 0.04])
boton_rst = Button(boton_rstdonde, 'Reset',
                   hovercolor='0.975')
def grafico_reinicia(event):
    freq_slider.reset()
    ampl_slider.reset()
    fase_slider.reset()
    return()
    
boton_rst.on_clicked(grafico_reinicia)

plt.show()

Referencia: matplotlib.widgets.Slider

[ algoritmo ] [ ejemplos ]
..


2. Ejemplos

TELG1034 - Procesamiento Digital de Señales

Muestreo con Python

muestreo Alias cos animate 01

Aliasing con Python

muestreo Alias cos animate

 

[ algoritmo ] [ ejemplos ]