Tkinter(pySimpleGUI)でmatplotlibなし でグラフを書く⽅法 2019/09/10 オカザキ

⾃⼰紹介 • オカザキ • 職業︓プログラマー • http://twitter.com/dario_okazaki • PyconJP2017 トーク「Kivyによるアプリケーション開発のすすめ」 • ⻑野Python会 with NSEG（2018/7/28）「PythonのGUI@2018」

今⽇の内容のきっかけ Tkinterでグラフを書きたいけどmatplotlibを⼊れたくない

今⽇の内容のきっかけ Tkinterのcanvasで書けば⼀応できる ・書くのがめんどい

PySympleGUI • PySympleGUI • https://pysimplegui.readthedocs.io/en/latest/ • 2018年からプロジェクトが開始 • https://www.reddit.com/r/Python/comments/d2ghve/a_case_for_a _pythonic_python_gui/ • tkinter, Qt(⼀部), Remi, WxPythonのラッパー pip install pysimplegui or pip3 install pysimplegui

PySimPleGUIの紹介 • Tkinterを使うのであればPySimpleGUIを使ってみたらという話 （ https://qiita.com/dario_okazaki/items/656de21cab5c81cabe59 ）

前回のstapyのLTで話した内容 • Twitttrでつぶやいたら公式から連絡が来た

PySimpleGUIでグラフを書く • DrawCircle • DrawLine • DrawPoint • DrawRectangle • DrawOval • DrawImage https://pysimplegui.readthedocs.io/en/latest/#graph-element

Stapyの５０回の参加者の数のグラフを書く • CommpassのAPIから取得 • https://connpass.com/about/api/ • Jsonから”acccept”の値をグラフにする

棒グラフ graph.DrawRectangle(top_left=(i * BAR_SPACING + EDGE_OFFSET, graph_infos[i][1]['accepted']), bottom_right=(i * BAR_SPACING + EDGE_OFFSET + BAR_WIDTH, 0), fill_color='blue’) graph.DrawText(text=graph_infos[i][1][‘accepted’], location=(i*BAR_SPACING+EDGE_OFFSET+2, graph_infos[i][1]['accepted']+10)) # 値を表⽰ graph.DrawText(text=graph_infos[i][1]['title'], location=(i*BAR_SPACING+EDGE_OFFSET+25, -10))

折れ線グラフ graph.DrawText(text=graph_infos[i][1]['accepted'], location=(i*BAR_SPACING+EDGE_OFFSET+2, graph_infos[i][1]['accepted']+10)) # 値を表⽰ graph.DrawText(text=graph_infos[i][1]['title'], location=(i*BAR_SPACING+EDGE_OFFSET+25, -10)) if i > 0: graph.DrawLine(((i-1) * BAR_SPACING + EDGE_OFFSET+ BAR_WIDTH/2 , graph_infos[(i-1)][1]['accepted']) , (i * BAR_SPACING + EDGE_OFFSET+ BAR_WIDTH/2 , graph_infos[i][1]['accepted']),color='blue', width=1 ) graph.DrawPoint((i * BAR_SPACING + EDGE_OFFSET+ BAR_WIDTH/2 ,graph_infos[i][1]['accepted']), size=3 ,color='blue',) # 値を表⽰

まとめ • TODO • グラフの種類（折れ線／棒グラフ）の切り替え • 累積もしたい • ボタンで複数のグラフを同時に表⽰する • 範囲指定（数字を⼊⼒）で表⽰する範囲を変える • マウスでドラッグして表⽰範囲を変える • 続き（TODO実装）はQittaに書く予定