Pythonのスクリプトからウェブアプリを簡単に作れるStreamlitをさわってみた

どうも、DA 事業本部の大澤です。

The fastest way to build custom ML toolsと謳っているStreamlit をさわってみました。HTMLやJS、CSSをいじることなく、Pythonのスクリプトからウェブアプリが作れて便利さに感動しました!

今回はStreamlitに含まれるサンプルアプリを動かした後に、Pandasのデータフレームを使った簡単なウェブアプリを作ってみたので、その内容を紹介します。

やってみる

インストール

Streamlit は pip でインストールすることで使えます。

pip install streamlit

サンプルを動かす

デフォルトでサンプルアプリケーションが用意されているので、見てみることにします。

streamlit hello

コマンドを実行すると、次のような感じでローカル URL とネットワーク URL が表示されます。

You can now view your Streamlit app in your browser.

Local URL: http://localhost:8501
Network URL: http://xxx.xxx.xxx.xxx:8501

表示に従い、ブラウザで開くと次のような画面が表示されます。

デモは 4 種類用意されています。

Mapping Demo の場合だと、次のように地図データが描画され、複数のレイヤーの表示を切り替えることができます。

データフレームを表示する

次は実際にコードを書いて試してみます。 まずは Iris データセットのデータフレームを表示してみます。 スクリプトは次の通りです

import streamlit as st
import pandas as pd
from sklearn import datasets

@st.cache
def load_data():
    iris = datasets.load_iris()
    df = pd.DataFrame(iris.data, columns=iris.feature_names)
    df['target'] = iris.target_names[iris.target]
    return df

df = load_data()
targets = list(df.target.unique())
selected_targets = st.multiselect('select targets', targets, default=targets)
df = df[df.target.isin(selected_targets)]

st.dataframe(df)

次のコマンドを実行して、WEBアプリを起動させます。

streamlit run streamlit_example.py 

出力されたURLにブラウザでアクセスすると、データフレームが表示されています。

target列が隠れていますが、横にスクロールさせるとみることができます。

上のチェックボックスで表示するtarget列を指定できます。指定内容はデータフレームに反映されます。

ヒストグラムを表示する

先ほどのスクリプトを少し修正&追加して次の内容に変更し、上書き保存します。 これによって各列の値の最大値がハイライトされるのと、各列のヒストグラムが描画されます。

import streamlit as st
import pandas as pd
from sklearn import datasets


@st.cache
def load_data():
    iris = datasets.load_iris()
    df = pd.DataFrame(iris.data, columns=iris.feature_names)
    df['target'] = iris.target_names[iris.target]
    return df


df = load_data()
targets = list(df.target.unique())
selected_targets = st.multiselect('select targets', targets, default=targets)
df = df[df.target.isin(selected_targets)]

st.dataframe(df.style.highlight_max(axis=0))

df.hist()
st.pyplot()

スクリプトの保存が完了し、ウェブアプリの画面に戻ると、右上に次のような表示が出ています。

Rerunを選択し、スクリプトの変更内容が反映されます。

targetの指定を変更すると、ヒストグラムにもその内容が反映されます。

さいごに

Python スクリプトを実行すると、その内容に合わせたウェブアプリが HTML や CSS、JS を実装することなく動かせる Streamlit について紹介しました。プロトタイプの作成用途だけでなくデータ探索、モデルの学習過程の分析など幅広く使えそうです。 また、現在はまだベータ段階のようですがアクセスコントロール等が可能なStreamlit for teamsもあるようです。興味がある方はベータに参加してみると良さそうです。

参考