streamlitの簡単な使い方

概要

• 時系列データ（電力データ）を可視化
• 使用パッケージはstreamlitとpandasの2つ
• date_inputでインタラクティブに可視化

streamlitを使ったソースコード

• 書いたソースコード(main.py)全体は下記（コピペで動くはず）

import streamlit as st
import pandas as pd

def main():
    # データフレーム読み込み
    df = pd.read_csv('./data/sample.csv',encoding='cp932',index_col=[0],parse_dates=[0])
    # データ追加
    df['plus100'] = df['電力量'] + 100
    # Calender
    select_dates = st.date_input('表示したい日付の選択',value=(df.index[0],df.index[-1]),min_value=df.index[0],max_value=df.index[-1])

    st.line_chart(df [select_dates[0].strftime("%Y-%m-%d"):select_dates[-1].strftime("%Y-%m-%d")].resample('D').mean())


if __name__=="__main__":
    main()

• 読み込むパッケージはstreamlitとpandasの2つ

import streamlit as st
import pandas as pd

• 今回はCSVを読み込んでいるので、pandasのread_csvで読み込んでいます。各設定はご自身の環境に合わせてください。
  • データの追加はなくても問題ないです。

def main():
    # データフレーム読み込み
    df = pd.read_csv('./data/sample.csv',encoding='cp932',index_col=[0],parse_dates=[0])
    # データ追加
    df['plus100'] = df['電力量'] + 100

• st.date_inputでカレンダーの表示を行っています。
  • valueにタプルで与えることで、カレンダーを範囲指定できるようになります。
  • min_value,max_valueはどの範囲まで指定できるかを指定しています。
  • それぞれ、データフレームのindexの最初と最後を読み込んでいます。

# Calender
select_dates = st.date_input('表示したい日付の選択',value=(df.index[0],df.index[-1]),min_value=df.index[0],max_value=df.index[-1])

• st.line_chartで線グラフの描画をします。
  • データフレームには、st.date_inputで出力されたselect_datesに格納されたタプル(描画開始日付,描画終了日付)を指定しています。
  • 今回使用したデータが細かすぎるので、1日で集約するためにresample('D')をしています。

st.line_chart(df [select_dates[0].strftime("%Y-%m-%d"):select_dates[-1].strftime("%Y-%m-%d")].resample('D').mean())

• 起動するには、ディレクトリ内でstreamlit run main.pyで実行します。

streamlitの簡単まとめ

• 20行弱でこんな感じにできます。
• 可視化アプリがこんなに簡単にできるなんて。。。

Youtubeで作り方を動画にしてみました。

【初心者向け】Streamlitの簡単な使い方【pythonでWebアプリ】