Help us understand the problem. What is going on with this article?

[Python]簡単に可視化アプリケーションが作れる"Streamlit"をテスト書きした

はじめに

Pythonベースでグラフを入れたWebアプリケーションを作る場合、グラフライブラリ Plotly + Webアプリケーションフレームワーク Dash by Plotly の取り合わせを愛用してきました。
が、この度 Dash のポジションを脅かすポテンシャル大な大型新人 Streamlit と出会ったため、テスト書きしたメモを投下します。

Streamlit とは?

Streamlit is an open-source app framework for Machine Learning and Data Science teams. Create beautiful data apps in hours, not weeks. All in pure Python. All for free.

HTML・CSS・JavaScriptを書くこと無く、Pythonスクリプト単体でWebアプリケーションを作れるアプリケーションフレームワーク。
フロントエンドは React + Bootstrap な作りで、Pythonスクリプト単体でOKな点も入れてほぼ Dash と同タイプのフレームワークと言えます。

Dash と比べると、スタイル・ページレイアウトを自在に決められるフレキシブルさが Streamlit には無いです。
カスタムCSS・スタイルを入れるAPIが無く、ページレイアウトもサイドメニュー + ボディのテンプレートでガッチリ決まっています。
つまり、デザインも含めてフレームワーク側が仕様を定めているため、デザイン決めのコスト無く、データ処理・分析の主な処理のスクリプト書きに Dash 以上に注力出来ます。

また、DashPlotly 専用のWebアプリケーションフレームワークですが、Streamlit は下記のグラフライブラリをサポートしています。

  • Matplotlib
    • SeabornMaptplotlib のラッパーなのでおそらく大丈夫
  • Altair
  • Graphviz
  • Plotly
    • もちろん、Plotly Express も大丈夫!
  • Bokeh

Plotly はあんまり、、な場合でもWebアプリケーションを作ることが出来ます。

テスト書きメモ

インストール

$ pip install streamlit

デモページ立ち上げ

$ streamlit hello

http://localhost:8501/ でデモページが立ち上がります。

image.png

スクリプトを書く

Plotly Express のデータをプロットするサンプルスクリプト qiita.py を書きます。かなりシンプルです。

qiita.py
import streamlit as st
import plotly.express as px
import plotly.io as pio

# data
data = px.data.iris()

# sidemenu
st.sidebar.markdown(
    "# Qiita sample"
)
template = st.sidebar.selectbox(
    "Template", list(pio.templates.keys())
)

# body
st.write(
    px.scatter(data, x="sepal_width", y="sepal_length", template=template)
)

qiita.py が置いてあるディレクトリ上で

$ streamlit run qiita.py

を実行すると、http://localhost:8501/ でアプリケーションが立ち上がります。

image.png

もし Dash で書く場合、HTMLコンポーネントをゴリゴリ書いたり、、でコード量は大体2倍になるかなーと思います。

Tips

随時アップデートします。

どうしてもスタイルを修正したい場合

st.markdown でmarkdownコンポーネントを作り、unsafe_allow_html パラメータへ true を与えつつ直で <style> タグを書きます。

st.markdown(
    "<style>h1{color: red}</style>",
    unsafe_allow_html=True
)

Streamlit にスタイリングの口が無いゆえの黒魔術コードですが、本体のフォーラムページをチェックしてもこれぐらいしか無さそう、、

リモートリソースの streamlit run

例えばGitHubへ上がっているソースコードをサクッと実行したい場合、Streamlit はローカルクローン無しで下記の様に実行出来ます。

$ streamlit run https://raw.githubusercontent.com/prs-watch/streamlit-sample/master/sample.py

上で例示したサンプルのリポジトリはこちらです。

まとめ

デザイン決めのコストをゴリッと削れるため、コード量少なく、サクッとWebアプリケーションが作れます。提供デザインもシンプルで気に入っています。
DashDash で良い点がありますし、 Streamlit 自体メジャーバージョン未リリースだったりとの点もありますが、楽にアプリケーションを作りたい場合にはかなり重宝しています。

オススメ度は高いので、例えばダッシュボードを作りたいなー、と言う場合、1回テスト書きしてみてはいかがでしょうか。

prs-watch
会社員プログラマー兼MLBドリブンプログラマー。MLBだけで無く、サッカーでもコードを書きたいな、、
qiitadon
Qiitadon(β)から生まれた Qiita ユーザー・コミュニティです。
https://qiitadon.com/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした