🌡️

最近流行りの気温ヒートマップ画像を手軽に作れるwebアプリをstreamlitでさくっと作った

2023/11/06に公開

https://weather-heatmap.streamlit.app/?embed_options=show_toolbar

今年の夏は例年以上に暑い日が続いたことで、暑さを可視化するインフォグラフィックが流行りました。
その1つが↓のようなヒートマップで過去の気温の推移を可視化したものです。
https://twitter.com/kaz_ogiwara/status/1680580458701094915

n番煎じですが、この気温ヒートマップをwebで手軽に作成できるアプリを作って公開しました。

技術紹介

最近おぼえたstreamlitで動かしています。
デフォルトのグラフ機能 st.linechart() などは微調整ができない(やり方がわからない)ので使いづらいですが、普通に matplotlib のグラフをそのまま渡せるメソッドが用意されているのでめっちゃ便利でした。

matplotlibのグラフの追加方法
fig, ax = plt.subplots(figsize=(9, 16))
sns.heatmap(df, ax=ax)
st.pyplot(fig)

元データは気象庁HPの過去データ検索から取得しています。
streamlitでデータ取得するときは st.cache_data を使いましょう。使わないとユーザーが操作するたびにデータの読み込みが発生してパフォーマンスが落ちます。

データ読み込みの方法
@st.cache_data(show_spinner='Loading data...')
def load_data(block_no, month):
    df = pd.read_csv(filepath)
    return df

streamlit上でグラフを作ったときに、日本語を表示したい場合は文字化けしないように japanize-matplotlib を使用しましょう。
pythonスクリプトでimportするだけでOKです。

ちなみに plt.rcParams['font.family'] で日本語対応フォントを指定する方法はなぜかうまくいきませんでした。

pip install japanize-matplotlib

参考にした記事

https://uribo.quarto.pub/jmastats_heatmap/
https://yonesuke0716.hatenablog.com/entry/2022/10/12/173105

Discussion