Matplotlib in Gtk4-Anwendung einbetten und mit Treeview interagieren

Einführung

In diesem Lab lernen Sie, wie Sie Matplotlib in eine Gtk4-Anwendung einbetten und mit einer Treeview (Baumansicht) interagieren können, um Daten zu speichern. Sie können Daten plotten, indem Sie auf einen Eintrag in der Treeview doppelt klicken.

Tipps für die virtuelle Maschine (VM)

Nachdem die VM gestartet wurde, klicken Sie in der oberen linken Ecke, um zur Registerkarte Notebook zu wechseln und auf Jupyter Notebook für die Übung zuzugreifen.

Manchmal müssen Sie möglicherweise einige Sekunden warten, bis Jupyter Notebook vollständig geladen ist. Aufgrund von Einschränkungen in Jupyter Notebook kann die Validierung von Vorgängen nicht automatisiert werden.

Wenn Sie während des Lernens Probleme haben, können Sie sich gerne an Labby wenden. Geben Sie nach der Sitzung Feedback ab, und wir werden das Problem für Sie umgehend beheben.

Einrichten der Umgebung

Zunächst müssen Sie eine virtuelle Umgebung erstellen und die erforderlichen Pakete installieren.

## create virtual environment
python3 -m venv matplotlib_tutorial

## activate the environment
source matplotlib_tutorial/bin/activate

## install necessary packages
pip install numpy matplotlib PyGObject

Erstellen des Anwendungsfensters

Als Nächstes müssen Sie das Anwendungsfenster erstellen, das die Treeview (Baumansicht) und das Matplotlib-Diagramm enthalten wird.

import gi

gi.require_version('Gtk', '4.0')
from gi.repository import Gtk

from numpy.random import random

from matplotlib.backends.backend_gtk4agg import FigureCanvas
from matplotlib.figure import Figure


class DataManager(Gtk.ApplicationWindow):
    num_rows, num_cols = 20, 10

    data = random((num_rows, num_cols))

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.set_default_size(600, 600)

        self.set_title('GtkListStore demo')

        vbox = Gtk.Box(orientation=Gtk.Orientation.VERTICAL, homogeneous=False,
                       spacing=8)
        self.set_child(vbox)

        label = Gtk.Label(label='Double click a row to plot the data')
        vbox.append(label)

        sw = Gtk.ScrolledWindow()
        sw.set_has_frame(True)
        sw.set_policy(Gtk.PolicyType.NEVER, Gtk.PolicyType.AUTOMATIC)
        sw.set_hexpand(True)
        sw.set_vexpand(True)
        vbox.append(sw)

        model = self.create_model()
        self.treeview = Gtk.TreeView(model=model)
        self.treeview.connect('row-activated', self.plot_row)
        sw.set_child(self.treeview)

        fig = Figure(figsize=(6, 4), layout='constrained')

        self.canvas = FigureCanvas(fig)
        self.canvas.set_hexpand(True)
        self.canvas.set_vexpand(True)
        vbox.append(self.canvas)
        ax = fig.add_subplot()
        self.line, = ax.plot(self.data[0, :], 'go')

        self.add_columns()

    def plot_row(self, treeview, path, view_column):
        ind, = path
        points = self.data[ind, :]
        self.line.set_ydata(points)
        self.canvas.draw()

    def add_columns(self):
        for i in range(self.num_cols):
            column = Gtk.TreeViewColumn(str(i), Gtk.CellRendererText(), text=i)
            self.treeview.append_column(column)

    def create_model(self):
        types = [float] * self.num_cols
        store = Gtk.ListStore(*types)
        for row in self.data:
            it = store.insert(-1)
            store.set(it, {i: val for i, val in enumerate(row)})
        return store


def on_activate(app):
    manager = DataManager(application=app)
    manager.show()


app = Gtk.Application(application_id='org.matplotlib.examples.GTK4Spreadsheet')
app.connect('activate', on_activate)
app.run()

Plotten der Daten

Nun werden Sie die Daten plotten, indem Sie auf einen Eintrag in der Treeview (Baumansicht) doppelt klicken.

    def plot_row(self, treeview, path, view_column):
        ind, = path
        points = self.data[ind, :]
        self.line.set_ydata(points)
        self.canvas.draw()

Spalten zur Treeview hinzufügen

Sie müssen Spalten zur Treeview (Baumansicht) hinzufügen, um die Daten anzuzeigen.

    def add_columns(self):
        for i in range(self.num_cols):
            column = Gtk.TreeViewColumn(str(i), Gtk.CellRendererText(), text=i)
            self.treeview.append_column(column)

Erstellen des Modells

Schließlich müssen Sie das Modell erstellen, um die Daten zu speichern.

    def create_model(self):
        types = [float] * self.num_cols
        store = Gtk.ListStore(*types)
        for row in self.data:
            it = store.insert(-1)
            store.set(it, {i: val for i, val in enumerate(row)})
        return store

Zusammenfassung

In diesem Lab (Praktikum) haben Sie gelernt, wie Sie Matplotlib in eine Gtk4-Anwendung einbetten und mit einer Treeview (Baumansicht) interagieren können, um Daten zu speichern. Sie können nun Daten plotten, indem Sie auf einen Eintrag in der Treeview doppelt klicken.

Gtk4 Spreadsheet Sgskip