Streamlit でバックテスト結果を共有する | 生成AIxPythonで始める株式分析|Python×J-Quants

バックテスト結果を Notebook に閉じておくと、別の人や別の日の自分が再現するのに手間がかかります。本記事は、#11-3「移動平均クロス戦略を 5 銘柄でバックテスト」で作った SMA クロス戦略の結果を Streamlit でダッシュボード化し、URL クエリパラメータで設定を渡せる形にまとめる手順を公開します。

本記事は結果共有の枠組みを学ぶための教材です。

完成イメージ

パーツ	役割
サイドバー	短期 SMA / 長期 SMA / コスト率 / 銘柄選択
メイン上部	CAGR・シャープレシオ・最大ドローダウン
メイン中段	資産曲線(銘柄ごと)
メイン下段	評価指標テーブル + CSV ダウンロード
URL	`?short=25&long=75&codes=7203,9984`

URL を相手に渡すと、相手の画面でも同じ条件で結果が再現できます。

入力データ

事前に J-Quants から取得した日次株価を使います。

prices.csv
Date,Code,C
2022-01-04,7203,2110.5
2022-01-05,7203,2128.0
...

検証バージョン: Python 3.12.5 / pandas 2.2.3 / numpy 2.0 / streamlit 1.40 / plotly 5.20

アプリ本体

1
"""backtest_app.py — SMA クロス戦略のバックテスト結果共有ダッシュボード
2
"""
3
from __future__ import annotations
4

5
import numpy as np
6
import pandas as pd
7
import streamlit as st
8
import plotly.graph_objects as go
9

10
PRICES_PATH = "prices.csv"
11
INITIAL_CAPITAL = 1_000_000
12

13

14
# --- データ・ロジック ---------------------------------------------------------
15

16
@st.cache_data
17
def load_prices(path: str) -> pd.DataFrame:
18
    df = pd.read_csv(path, parse_dates=["Date"])
19
    return df.sort_values(["Code", "Date"]).reset_index(drop=True)
20

21

22
def add_signals(df: pd.DataFrame, short: int, long: int) -> pd.DataFrame:
23
    df = df.sort_values(["Code", "Date"]).copy()
24
    g = df.groupby("Code", group_keys=False)
25
    df["sma_s"] = g["C"].transform(lambda s: s.rolling(short).mean())
26
    df["sma_l"] = g["C"].transform(lambda s: s.rolling(long).mean())
27
    df["signal"] = (df["sma_s"] > df["sma_l"]).astype(int)
28
    df["position"] = g["signal"].shift(1)   # 翌営業日から建てる
29
    return df
30

31

32
def backtest_one(df_one: pd.DataFrame, cost: float) -> pd.DataFrame:
33
    df = df_one.dropna(subset=["position"]).copy()
34
    df["ret"] = df["C"].pct_change().fillna(0)
35
    df["pos_change"] = df["position"].diff().abs().fillna(df["position"])
36
    df["strategy_ret"] = df["position"] * df["ret"] - df["pos_change"] * cost
37
    df["equity"] = INITIAL_CAPITAL * (1 + df["strategy_ret"]).cumprod()
38
    return df
39

40

41
def metrics(df: pd.DataFrame) -> dict[str, float]:
42
    eq = df["equity"]
43
    ret = df["strategy_ret"]
44
    n = len(ret)
45
    years = n / 252 if n > 0 else 0
46
    cagr = (eq.iloc[-1] / INITIAL_CAPITAL) ** (1 / years) - 1 if years > 0 else np.nan
47
    sharpe = (ret.mean() / ret.std(ddof=0)) * np.sqrt(252) if ret.std(ddof=0) > 0 else np.nan
48
    rolling_max = eq.cummax()
49
    mdd = ((eq - rolling_max) / rolling_max).min()
50
    return {"cum_return": eq.iloc[-1] / INITIAL_CAPITAL - 1,
51
            "cagr": cagr, "sharpe": sharpe, "max_drawdown": mdd}
52

53

54
# --- URL クエリパラメータ ---------------------------------------------------
55

56
def get_query_params() -> dict[str, str | list[str]]:
57
    qp = st.query_params
58
    # st.query_params は文字列または文字列リスト。1 件目に揃える
59
    return {k: (v if isinstance(v, str) else v[0]) for k, v in qp.items()}
60

61

62
def codes_from_query(default: list[str]) -> list[str]:
63
    raw = st.query_params.get("codes")
64
    if not raw:
65
        return default
66
    if isinstance(raw, list):
67
        raw = raw[0]
68
    return [c.strip() for c in raw.split(",") if c.strip()]
69

70

71
# --- アプリ -----------------------------------------------------------------
72

73
st.set_page_config(page_title="バックテスト結果", layout="wide")
74
st.title("SMA クロス戦略 — バックテスト結果")
75

76
prices = load_prices(PRICES_PATH)
77
all_codes = sorted(prices["Code"].astype(str).unique())
78

79
q = get_query_params()
80
default_short = int(q.get("short", 25))
81
default_long = int(q.get("long", 75))
82
default_cost = float(q.get("cost", 0.001))
83
default_codes = codes_from_query(default=all_codes[:5])
84

85
with st.sidebar:
86
    st.header("設定")
87
    short = st.number_input("短期 SMA(日)", 5, 100, value=default_short, step=5)
88
    long = st.number_input("長期 SMA(日)", 20, 250, value=default_long, step=5)
89
    cost = st.number_input("片道コスト", 0.0, 0.01, value=default_cost, step=0.0005, format="%.4f")
90
    codes = st.multiselect("対象銘柄", options=all_codes, default=default_codes)
91

92
# URL に現在の条件を反映(共有用)
93
st.query_params.update(short=str(short), long=str(long),
94
                       cost=str(cost), codes=",".join(codes))
95

96
if not codes or short >= long:
97
    st.warning("銘柄を選び、短期 SMA は長期 SMA より小さくしてください。")
98
    st.stop()
99

100
target = prices[prices["Code"].astype(str).isin(codes)]
101
target = add_signals(target, short, long)
102

103
rows = []
104
curves: dict[str, pd.Series] = {}
105
for code, df_one in target.groupby("Code"):
106
    bt = backtest_one(df_one, cost)
107
    rows.append({"Code": str(code), **metrics(bt)})
108
    curves[str(code)] = bt.set_index("Date")["equity"]
109

110
summary = pd.DataFrame(rows).set_index("Code")
111

112
col1, col2, col3 = st.columns(3)
113
col1.metric("CAGR 平均", f"{summary['cagr'].mean()*100:.2f}%")
114
col2.metric("Sharpe 平均", f"{summary['sharpe'].mean():.2f}")
115
col3.metric("MDD 中央値", f"{summary['max_drawdown'].median()*100:.2f}%")
116

117
# 資産曲線
118
fig = go.Figure()
119
for code, eq in curves.items():
120
    fig.add_trace(go.Scatter(x=eq.index, y=eq.values, name=code, mode="lines"))
121
fig.update_layout(
122
    title=f"Eq curves — SMA({short}/{long}), cost {cost*100:.2f}%",
123
    yaxis_title="Eq (JPY)", template="plotly_white",
124
    hovermode="x unified", height=500,
125
)
126
st.plotly_chart(fig, use_container_width=True)
127

128
st.subheader("評価指標")
129
st.dataframe(summary.round(4), use_container_width=True)
130

131
csv_bytes = summary.reset_index().to_csv(index=False).encode("utf-8-sig")
132
st.download_button("評価指標 CSV", data=csv_bytes,
133
                   file_name="backtest_summary.csv", mime="text/csv")
134

135
st.caption("本記事は学習用の教材です。")

URL クエリパラメータで渡す

ダッシュボードを共有するときに、相手にも同じ条件で見てほしい場合があります。Streamlit 1.30 以降は st.query_params でクエリパラメータを読み書きできます。

http://localhost:8501/?short=20&long=60&cost=0.002&codes=7203,9984,8306

このアプリは、サイドバーで値を変えるたびに st.query_params.update(...) で URL にも反映します。ブラウザの戻る・進むも自然に動き、URL コピーで設定を共有できます。

キャッシュとデータ更新

関数	キャッシュの判断
`load_prices`	`@st.cache_data` を付ける(ファイルパスでキャッシュキー化)
`add_signals`	軽いのでキャッシュなしで OK
`backtest_one`	軽量だが頻繁に呼ぶならキャッシュ可

データを更新したら、Streamlit のメニューから「Clear cache」を実行するか、st.cache_data.clear() をコード上から呼びます。

レイアウトの工夫

メイン上部: 重要メトリクスは 3 〜 4 個まで(st.metric を st.columns で並べる)
メイン中段: チャートは 1 つ。複数並べたいなら st.tabs
メイン下段: 詳細テーブルとダウンロード
フッター: 注意書き(st.caption)で必ず免責を 1 行

ダッシュボードは「画面を開いてから何秒で要点が掴めるか」を最優先にします。情報を縦に積み過ぎないことが効きます。

落とし穴

クエリパラメータの型: すべて文字列で来る。int(...)、float(...) で変換する
multiselect の URL 反映: , 区切りで持つのが扱いやすい
st.stop の場所: ガード(銘柄未選択など)を上に置き、計算前に止める
ファイルパス絶対化: デプロイ環境ではカレントディレクトリが変わる。Path(__file__).parent / "prices.csv" のように相対パスを基準化
時系列の連結: 銘柄ごとに営業日数が違うと、複数曲線の長さが揃わない。共通期間に切るか、長い方をそのまま見せるかを決めておく

生成AI へのプロンプト例

目的:
SMA クロス戦略（短期 SMA が長期 SMA を上抜けた翌営業日から買い建て、下抜けた翌営業日に手仕舞い）のバックテスト結果を Streamlit でダッシュボード化する。

入力:
prices.csv (Date, Code, C)

UI 要件:
- サイドバー: 短期 SMA / 長期 SMA / 片道コスト / 銘柄(multiselect)
- メイン: CAGR 平均 / Sharpe 平均 / MDD 中央値 のメトリクス
- 銘柄ごとの資産曲線を Plotly で重ね描き
- 評価指標テーブルと CSV ダウンロード
- URL クエリパラメータ ?short=&long=&cost=&codes= で設定を共有可

制約:
- streamlit 1.40 系 / pandas 2.2 / numpy 2.0 / plotly 5.20
- 翌営業日からポジションを取る(先読み禁止、shift(1))
- 0 件・条件不正のときは st.warning → st.stop

まとめ

バックテストはダッシュボード化すると共有・再現が一気に楽になる
URL クエリパラメータで設定を渡せる形にすると、相手の画面でも同じ条件を再現できる
メトリクス → チャート → テーブル → ダウンロードの順で縦に並べる
重い処理は @st.cache_data、軽い処理は素のままで十分

目次