【Streamlit】基本文法(テキスト/表/グラフ/マジックコマンド/画像表示)

公式リファレンス

ブラウザに表示

先にブラウザで表示する方法を記述しておきます。

※main.pyは任意のファイル名に置き換えてください

streamlit run main.py

コマンドを実行すると、以下のように表示されるので、URLをブラウザにコピペすれば実行結果が表示されます。

インポート

最初に必要なライブラリをインポートします。

asで別名を付けています。

import streamlit as st
import numpy as np
import pandas as pd

基本的な記述

タイトル

st.title('Streamlit 基本操作')

テキスト

st.write('Streamlit 練習')

結果

表

df = pd.DataFrame({
    '1列目': [1, 2, 3, 4],
    '2列目': [10, 20, 30, 40],
})

# 表示
st.write(df)

結果

1列目をクリックすると簡単にソート順を変更できます。

dataframe

引数を渡し、縦横の長さ(px)などを指定できます。

st.dataframe(df, width=100, height=100)

ハイライトを付けることもできます。

highlight_max → 一番多い値に色を付ける
highlight_min → 一番小さい値に色を付ける
axis=0 → 列の指定
axis=1 → 行の指定

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

table

先ほど実行したコードのdataframe部分をtableに変えます。

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

実行すると、先ほどとは表に見た目が変わったことが分かります。

tableを使うと静的な表を作成することができます。
ただし、簡単にソート順を変更するなどの操作が出来なくなります。

マジックコマンド

マークダウン方式で文字列を記述できます。

# 小
## 中
### 大

pythonのコードを書きたいとき

    ```Python
    import streamlit as st
    import numpy as np
    import pandas as pd
    ```

簡単にコピーすることもできます。

グラフ

※下記のデータを使い回します。
※呼び出しのコードだけ書き換えていきます。

df = pd.DataFrame(
    # 行20 列3で乱数を生成
    np.random.rand(20, 3),
    # カラム名
    columns=['a', 'b', 'c']
)

折れ線グラフ

st.line_chart(df)

SVGやPNGで保存することも可能です。

エリアチャート

st.area_chart(df)

棒グラフ

st.bar_chart(df)

マップ

df = pd.DataFrame(
    # 新宿付近
    np.random.rand(100, 2)/[50, 50]  + [35.69, 139.70],
    # latitude 緯度 longitude 経度
    columns=['lat', 'lon']
)

st.map(df)

画像表示

今回はmain.pyと同じ階層にsample.png

# ライブラリ追加
from PIL import Image

img = Image.open('sample.jpg')

# use_column_width 実際のレイアウトの横幅に合わせるか
st.image(img, caption='Super Mario', use_column_width=True)

こちらも動的なので、簡単に拡大、縮小の操作ができます。

画像以外にも動画や音声などのメディアも載せることが可能なので、公式リファレンスを参考にしてみてください。

レイアウトについてに記事を投稿しました。↓