Streamlitとは
StreamlitはPython向けのWebアプリケーションフレームワークです。
Streamlitを使うとフロントエンドの知識ゼロでもデータを可視化するためのWebアプリケーションを簡単に作れます。以下のような機能が特徴。
- 変数を地の文に書くだけで、GUIに出力される(マジックコマンド)
-
st.radioやst.text_inputのようなWidget APIを呼び出すだけで、GUIコンポーネントが生成される
Streamlitの最新バージョン
Streamlitの最新バージョンはChangelogで確認できます。
2024/5/23時点で最新バージョンは1.35.0です。
1.35.0では次がHighlightsとしてアナウンスされています。
- チャートのSelection
- DataFrameのSelection
- st.logo
また、st.page_linkにGoogleマテリアルアイコンを表示できるようになりました。
チャートのSelection
SelectionというのはGUI上で選択したデータをPythonコード側で受け取れる機能です。
Selectionは現時点ではst.plotly_chart、st.altair_chart、st.vega_lite_chartの3つの高機能なチャートが対応していて、st.line_chartのようなシンプルなチャートでは残念ながら対応していません。
import streamlit as st
import plotly.express as px
import pandas as pd
# サンプルデータセットを読み込む
df = px.data.iris()
# Plotlyで散布図を描画する
fig_scatter = px.scatter(df, x="sepal_width", y="sepal_length")
selection = st.plotly_chart(fig_scatter, key="iris_scatter", on_select="rerun")
# selectionには選択されたデータが入っている
with st.expander("selection"):
st.write(selection)
# selectionをDataFrameに変換してから表示する
df_selected = pd.DataFrame(selection["selection"]["points"])
st.dataframe(df_selected)
このSelectionを使うためには以下の両方が必要になります。
-
keyパラメータを指定する -
on_selectパラメータにrerunを指定する
上記のパラメータを指定する関係上、チャートを操作するたびにアプリがRerunされます。必要に応じて元のデータをキャッシュするなどの対策をしておきましょう。
上記のサンプルコードではPlotly Express (px)というサポートライブラリでチャートを生成していますが、graph_objectsを使って1からFigureを生成しても問題なくSelectionを使うことができます。
DataFrameのSelection
チャートのSelectionと同様にGUI上で選択したデータをPythonコード側で受け取ることができます。
import streamlit as st
import plotly.express as px
import pandas as pd
# st.write("## Plotly Selection")
# サンプルデータセットを読み込む
df = px.data.iris()
selection = st.dataframe(df, key="iris_df", on_select="rerun", selection_mode=["multi-row", "multi-column"],)
st.code(selection)
チャートのSelectionと同様に、以下の両方が必要になります。
-
keyパラメータを指定する -
on_selectパラメータにrerunを指定する
列選択を有効にするためにはselection_modeにsingle-columnあるいはmulti-columnを指定する必要があります。
また、1.35.0時点では、列選択を有効にするとDataFrameの列ソートが使えなくなるようです。
st.logo
メインページとサイドバーにロゴ画像を配置することができます。
サイドバーが開かれているときはメインページのロゴが隠れるので二重に表示されないのがいい感じですね。
import streamlit as st
# ロゴを選択する
logo = st.selectbox("ロゴを選択する", ["logo1", "logo2"], key="logo")
# 選択したロゴを表示する。できるだけ最初の方で実行する
st.logo(f"{logo}.png")
# サイドバーを開く
st.sidebar.write("This is a sidebar")
# 選択したロゴ画像は以下のもの
st.write("## Selected logo")
st.write("選択したロゴ画像は以下のもの")
st.image(f"{logo}.png")
st.page_linkへのGoogleマテリアルアイコンの表示
サブページにページリンクするときのリンクに表示するアイコンとしてGoogleマテリアルアイコンを使えるようになりました。
これまでサブページのファイル名に絵文字を入れたり、iconパラメータに絵文字を指定したり(icon="🔥"みたいに)していたんですよね…
import streamlit as st
st.page_link("pages/動物の写真を見る.py", icon=":material/pets:")
Googleマテリアルアイコンは下記のページから確認できます。
上記のページのアイコンの詳細からAndroidタブを選んだときに表示されるコードを使って、":material/アイコンのコード:"というように書けばOKです。
