Matplotlib を使ったシンプルな GUI の作成

はじめに

この実験では、Matplotlib のButtonウィジェットを使って簡単な GUI を作成する方法を学びます。この GUI を使うと、NextとPreviousのボタンを使って周波数を変更することで正弦波を変更できます。

VM のヒント

VM の起動が完了したら、左上隅をクリックしてNotebookタブに切り替え、Jupyter Notebook を使って練習しましょう。

時々、Jupyter Notebook が読み込み終わるまで数秒待つ必要がある場合があります。Jupyter Notebook の制限により、操作の検証を自動化することはできません。

学習中に問題に遭遇した場合は、Labby にお問い合わせください。セッション後にフィードバックを提供してください。そうすれば、迅速に問題を解決します。

必要なライブラリをインポートする

まず、必要なライブラリをインポートしましょう。これには、matplotlib.pyplot、numpy、およびmatplotlib.widgetsからのButtonが含まれます。

import matplotlib.pyplot as plt
import numpy as np
from matplotlib.widgets import Button

初期のグラフを設定する

次に、初期のグラフを設定します。numpyのarange関数を使って周波数 2Hz の正弦波を作成し、matplotlib.pyplotのplot関数を使ってプロットします。

freqs = np.arange(2, 20, 3)
fig, ax = plt.subplots()
t = np.arange(0.0, 1.0, 0.001)
s = np.sin(2*np.pi*freqs[0]*t)
l, = ax.plot(t, s, lw=2)

ボタンコールバック関数を作成する

次に、NextとPreviousのボタン用の 2 つのコールバック関数を作成します。これらの関数は、異なる周波数の新しい正弦波でグラフを更新します。

class Index:
    ind = 0

    def next(self, event):
        self.ind += 1
        i = self.ind % len(freqs)
        ydata = np.sin(2*np.pi*freqs[i]*t)
        l.set_ydata(ydata)
        plt.draw()

    def prev(self, event):
        self.ind -= 1
        i = self.ind % len(freqs)
        ydata = np.sin(2*np.pi*freqs[i]*t)
        l.set_ydata(ydata)
        plt.draw()

callback = Index()

`Next`と`Previous`のボタンを作成する

次に、matplotlib.pyplotのadd_axes関数を使ってNextとPreviousのボタンを作成し、先ほど作成したコールバック関数をon_clickedを使って割り当てます。

axprev = fig.add_axes([0.7, 0.05, 0.1, 0.075])
axnext = fig.add_axes([0.81, 0.05, 0.1, 0.075])
bnext = Button(axnext, 'Next')
bnext.on_clicked(callback.next)
bprev = Button(axprev, 'Previous')
bprev.on_clicked(callback.prev)

グラフを表示する

最後に、matplotlib.pyplotのshow関数を使ってグラフを表示します。

plt.show()

まとめ

この実験では、Matplotlib のButtonウィジェットを使って簡単な GUI を作成する方法を学びました。NextとPreviousのボタンを使って周波数を変更することで正弦波を変更する方法も学びました。