Incrustar gráficos Matplotlib en Tkinter

Luis Salcedo

25/09/2018 - Actualizado: 22/12/2020

Introducción:

Hola amigos de Internet, les doy la bienvenida a Mi Diario Python, el mejor blog para Aprender Python.

En este articulo veremos como incrustar gráficos, generados con matplotlib, en un ventana realizada con Tkinter.

Interesante ¿ No es cierto?

Así que prepárate, busca tu taza de café, y comencemos.

Matplotlib en Tkinter:

Muy bien, veamos como incrustar un gráfico en Tkinter.

Para ello, como habrás imaginado, necesitamos disponer de Matplotlib.

Puedes instalar Matpllib a través de pip: python -m pip install matplotlib.

Luego de esto, ya podemos comenzar.

Lo primero que haremos sera importar los recursos necesarios:

# importamos todos los modulos necesarios
from matplotlib.backends.backend_tkagg import FigureCanvasTkAgg, NavigationToolbar2TkAgg
from matplotlib.figure import Figure
import tkinter as Tk

# Declaramos la clase "Ventana"
class Ventana():
    def __init__(self, master):
        # Asignamos las propiedades
        self.frame = Tk.Frame(master)
        
        # Definimos las figuras y sus posiciones en la ventana
        # Para ello utilizamos "Figure"
        self.f = Figure( figsize=(20, 9), dpi=80 )
        """
        Ahora definimos los graficos, en este caso solo uno, "ax0".
        Para ello utilizamos el métodos "add_axes" proporcionado por Figure.
        """
        self.ax0 = self.f.add_axes( (0.25, .25, .50, .50), axisbg=(.75,.75,.75), frameon=False)
        
        # Ahora, utilizamos los tipicos métodos de matplotlib
        # definimos las etiquetas de lo ejes X e Y.
        # Y con plot generamos el gráfico con los datos
        self.ax0.set_xlabel( 'Y' )
        self.ax0.set_ylabel( 'X' )
        self.ax0.plot([1,4,5,6,7,4,8])
        
        self.frame = Tk.Frame( root )
        self.frame.pack(side=Tk.LEFT, fill=Tk.BOTH, expand=1)
 
        # Creamos el canvas, que podemos decir que es el lugar en donde
        # se mostrara el gráfico
        self.canvas = FigureCanvasTkAgg(self.f, master=self.frame)
        self.canvas.get_tk_widget().pack(side=Tk.TOP, fill=Tk.BOTH, expand=1)
        self.canvas.show()
     
        self.toolbar = NavigationToolbar2TkAgg(self.canvas, self.frame )
        self.toolbar.pack()
        self.toolbar.update()
 
 
if __name__ == '__main__':
    # Ahora preparamos a la ventana
    root = Tk.Tk()
    app = Ventana(root)
    # Titulo de la ventana
    root.title( "Gráficos" )
    # Dimensiones de la ventana
    root.geometry("500x500")
    root.update()
    root.deiconify()
    root.mainloop()

Ahora ejecutemos el código:

código completo del ejemplo: https://gist.github.com/LuisAlejandroSalcedo/90666ad607afa190c4761a5ac45b8795

Muy bien, excelente. ¿Que opinas?.

En caso de que quieras más de un gráfico, podemos hacerlo de la siguiente manera.

from matplotlib.backends.backend_tkagg import FigureCanvasTkAgg, NavigationToolbar2TkAgg
from matplotlib.figure import Figure
import numpy as np


import Tkinter as Tk

 
class Ventana():
    def __init__(self, master):
        self.frame = Tk.Frame(master)
        self.f = Figure( figsize=(10, 9), dpi=80 )
        # Como pueden observar, aquí agregamos más graficos con add_axes
        self.ax0 = self.f.add_axes( (0.05, .05, .50, .50), axisbg=(.75,.75,.75),

                                   frameon=False)
        self.ax1 = self.f.add_axes( (0.05, .55, .90, .45), axisbg=(.75,.75,.75),

                                   frameon=False)
        self.ax2 = self.f.add_axes( (0.55, .05, .50, .50), axisbg=(.75,.75,.75),

                                   frameon=False)

        
        self.ax0.set_xlabel('X')
        self.ax0.set_ylabel('Y')
        # utilizamos plot para generar los gráficos
        self.ax0.plot(np.max(np.random.rand(100,10)*10,axis=1),"r-")
        self.ax1.plot(np.max(np.random.rand(100,10)*10,axis=1),"g-")
        self.ax2.pie(np.random.randn(10)*100)

         
        self.frame = Tk.Frame( root )
        self.frame.pack(side=Tk.LEFT, fill=Tk.BOTH, expand=1)

        self.canvas = FigureCanvasTkAgg(self.f, master=self.frame)
        self.canvas.get_tk_widget().pack(side=Tk.TOP, fill=Tk.BOTH, expand=1)
        self.canvas.show()
    
        self.toolbar = NavigationToolbar2TkAgg(self.canvas, self.frame )
        self.toolbar.pack()
        self.toolbar.update()


if __name__ == '__main__':
    root = Tk.Tk()
    app = Ventana(root)
    root.title( "Gráficos" )
    root.update()
    root.deiconify()
    root.mainloop()