Tkinter

[Python/tkinter] matplotlib で作成したグラフをウィンドウ上で表示できるようにしよう！

  /

本記事では、matplotlibを用いて作成したグラフをGUI上に表示させる方法を解説していきます！グラフの作成方法が分からない方にも分かりやすく紹介します！

すらいむ管理人

GUI上でもグラフの結果を表示させたいときって結構ありますよね！

では解説していきます！

☆ 記事の信頼性

自動化アプリケーション作成に携わっている私が、初心者にも分かりやすくプログラミングの基礎を紹介しています。

ブックマークするといつでも確認することができます！

（準備）matplotlibによるグラフの作成

実際のプログラムに移る前に、matplotlib を用いてグラフを作成する必要があります。
今回は例として二次関数（０≦x≦20）のグラフを作成してみます
グラフの作成方法について既に知っている方はスキップしてください。

ここでは基本的なコードのみを紹介します！
では実際に以下のコードを実行してみて下さい。

import tkinter as tk
import matplotlib.pyplot as plt

x = []
y = []
# 二次関数データの生成
for i in range(0, 21):
    x.append(i)
    y.append(i * i)
    i += 1

plt.title("二次関数",fontname="MS Gothic")　#タイトルの表示
plt.plot(x,y)　#データのプロット
plt.xlabel("x軸",fontname="MS Gothic")　#x軸のタイトル表示
plt.ylabel("y軸",fontname="MS Gothic")　#y軸のタイトル表示
plt.show()

graph-image

このようなグラフが表示されたと思います。

では次のステップで、このグラフを plt.show() によって表示させるのではなく tkinter を用いて表示したウィンドウ上に埋め込む方法を解説していきます！

【余談】matplotlib で日本語が表示されない場合はこちらの記事を参考にしてみて下さい！

【余談】matplotlibで円グラフを書く方法も紹介しています！

tkinterのウィンドウにグラフを埋め込んでみよう

コードと実行結果

まず初めに以下のコードを実行してみて下さい。

import tkinter as tk
import matplotlib.pyplot as plt
from matplotlib.backends.backend_tkagg import FigureCanvasTkAgg

def graph():
    x = []
    y = []
    # 二次関数データの生成
    for i in range(0, 20):
        x.append(i)
        y.append(i * i)
        i += 1
    fig = plt.Figure(figsize=(5,4))
    instance=fig.subplots()
    instance.plot(x,y)
    instance.set_title("二次関数", fontname="MS Gothic")
    instance.set_xlabel("x軸", fontname="MS Gothic")
    instance.set_ylabel("y軸", fontname="MS Gothic")
    return fig

def btn_click():
    canvas = FigureCanvasTkAgg(graph(), master=root)
    canvas.get_tk_widget().pack()

root=tk.Tk()
root.geometry("700x400")

#ボタンウィジェットの配置
btn1=tk.Button(root,text="RUN",command=btn_click)
btn1.pack()

root.mainloop()

上記コードを実行するとボタンが付いたウィンドウが開かれ、このボタンをクリックすると同じウィンドウ内に先ほど作成したグラフが表示されます。

window-image
after-run-image

コードの解説

上記のように tkinter のウィンドウ上にグラフを表示させるためのコードは以下の部分になります。

（コード一部抜粋）

    fig = plt.Figure(figsize=(5,4))　# ② グラフを図に変換
    instance=fig.subplots()　# ③ グラフ自体をインスタンス化
    instance.plot(x,y)　# ④ インスタンスにグラフデータを貼り付け
    instance.set_title("二次関数", fontname="MS Gothic")
    instance.set_xlabel("x軸", fontname="MS Gothic")
    instance.set_ylabel("y軸", fontname="MS Gothic")

（ボタンクリック時に実行される関数）

def btn_click():
    canvas = FigureCanvasTkAgg(graph(), master=root)　# ① tkinterのウィンドウとグラフの紐づけ
    canvas.get_tk_widget().pack()　# ⑤ グラフの表示位置の指定

では順に説明していきます。

  1. 初めに、tkinter のウィンドウとグラフの紐づけを行います。
  2. matplotlib で出力されたグラフをプログラム上で受け渡しができるように図に変換します。
    変換する図のサイズは figsize で指定しています。
  3. 次に変換したグラフをインスタンス化します。
    このインスタンスを生成し、 figインスタンスを tkinter のウィンドウ上に埋め込むことで表示が可能となる仕組みです。
  4. 実際に作成したいグラフのデータをもとにグラフを作成。(適宜タイトルやラベル等を生成する)
  5. 最後にウィンドウ内のどの位置に配置するかを指定します。

以上となります。最後まで見ていただきありがとうございました！

次の記事では、Combobox（プルダウンリスト）の使い方を解説しています。
是非参考にしてみて下さい！

RELATED POST