既にあるグラフの上に、指標を追加したいが、新しいグラフとして出てしまう。

Question

実現したいこと

グラフ①に、グラフ②を重ねて表示したいが、グラフ①とグラフ②に分かれて出てしまう。
重なって出てこないため、いまは２つをそれぞれ fig.show() しています。

numpy, plotly, matpltlib でグラフをかいてます

グラフ①

グラフ②

前提

為替のグラフを作っていますが、本題はグラフをうまく表示できないことなので、為替のことは参考程度に記載します
↓
↓
↓

https://datapowernow.hatenablog.com/entry/2023/09/21/000737
http://home.netyou.jp/55/dpn/flag_pattern_detect_demo.html
https://www.youtube.com/watch?v=b5m7BZAHysk&list=LL&index=1

上記のコードを参考に、為替チャートのフラッグパターン（グラフ①）を作成、ボリンジャーバンド（グラフ②）を追加したいと思い、書きましたが、２つが重なって出てほしいです。

発生している問題・エラーメッセージ

/opt/homebrew/lib/python3.11/site-packages/_plotly_utils/basevalidators.py:105: FutureWarning:

The behavior of DatetimeProperties.to_pydatetime is deprecated, in a future version this will return a Series containing python datetime objects instead of an ndarray. To retain the old behavior, call `np.array` on the result

該当のソースコード

クソ長コードで申し訳ありませんが、概要を先に書きます
グラフ１の表示　→　line 138
グラフ２の表示　→　line 206

#グラフ１
import numpy as np
import pandas as pd
import plotly.graph_objects as go
from plotly.subplots import make_subplots
from scipy.stats import linregress
import matplotlib.pyplot as plt
import yfinance as yf
import pandas_ta as ta
import matplotlib.dates as mdates
from datetime import datetime, timedelta
from pandas_datareader import data as web
import mplfinance as mpf
import datetime as dt

def pivotid(df1, l, n1, n2): #n1 n2 before and after candle l
    if l-n1 < 0 or l+n2 >= len(df1):
        return 0

    pividlow=1
    pividhigh=1
    for i in range(l-n1, l+n2+1):
        if(df1.low[l]>df1.low[i]):
            pividlow=0
        if(df1.high[l]<df1.high[i]):
            pividhigh=0
    if pividlow and pividhigh:
        return 3
    elif pividlow:
        return 1
    elif pividhigh:
        return 2
    else:
        return 0

def detect_flag(df1, candle, backcandles, window, plot_flag=False):
    """
    Attention! window should always be greater than the pivot window! to avoid look ahead bias
    """
    localdf = df1[candle-backcandles-window:candle-window]
    highs = localdf[localdf['pivot'] == 2].high.tail(3).values
    idxhighs = localdf[localdf['pivot'] == 2].high.tail(3).index
    lows = localdf[localdf['pivot'] == 1].low.tail(3).values
    idxlows = localdf[localdf['pivot'] == 1].low.tail(3).index

    if len(highs) == 3 and len(lows) == 3:
        order_condition = (
            (idxlows[0] < idxhighs[0]
            < idxlows[1] < idxhighs[1]
            < idxlows[2] < idxhighs[2])
            or
            (idxhighs[0] < idxlows[0]
             < idxhighs[1] < idxlows[1]
             < idxhighs[2] < idxlows[2]) )

        slmin, intercmin, rmin, _, _ = linregress(idxlows, lows)
        slmax, intercmax, rmax, _, _ = linregress(idxhighs, highs)

        if (order_condition
            and (rmax*rmax)>=0.9
            and (rmin*rmin)>=0.9
            and slmin>=0.0001
            and slmax<=-0.0001):
            #and ((abs(slmin)-abs(slmax))/abs(slmax)) < 0.05):

            if plot_flag:
                fig = go.Figure(data=[go.Candlestick(x=localdf.index,
                open=localdf['open'],
                high=localdf['high'],
                low=localdf['low'],
                close=localdf['close'])])

                fig.add_scatter(x=localdf.index, y=localdf['pointpos'], mode="markers",
                marker=dict(size=10, color="MediumPurple"),
                name="pivot")
                fig.add_trace(go.Scatter(x=idxlows, y=slmin*idxlows + intercmin, mode='lines', name='min slope'))
                fig.add_trace(go.Scatter(x=idxhighs, y=slmax*idxhighs + intercmax, mode='lines', name='max slope'))
                fig.update_layout(
                xaxis_rangeslider_visible=False,
                plot_bgcolor='white', # change the background to white
                xaxis=dict(showgrid=True, gridcolor='white'), # change the x-axis grid to white
                yaxis=dict(showgrid=True, gridcolor='white') # change the y-axis grid to white
                )
                fig.show()

            return 1

    return 0


yf.pdr_override() # yfinanceライブラリでpandas_datareaderの関数をオーバーライド
start = dt.datetime.now() - dt.timedelta(hours=12)
end = dt.datetime.now()
symbol = 'USDJPY=X'
df = web.get_data_yahoo(tickers=symbol,start=start,end=end,period='12h',interval='1m')
df = df.sort_index()
df = df.reset_index(names='Gmt time')
df = df.drop(columns=['Adj Close', 'Volume'])
df.columns=['time', 'open', 'high', 'low', 'close']
#Check if NA values are in data
#df=df[df['volume']!=0]
df.reset_index(drop=True, inplace=True)
df.isna().sum()


# 無名関数（lambda関数）を定義しています。この関数は、DataFrameの各行を入力として受け取り、その行の名前（インデックス）を x.name としてアクセスします。
df['pivot'] = df.apply(lambda x: pivotid(df, x.name, 3, 3), axis=1)
df.head()


df['flag'] = df.apply(lambda x: detect_flag(df, x.name, 35, 3), axis=1)
df.tail()


df_detect = df[df['flag']!=0]
df_detect


def pointpos(x):
    if x['pivot']==1:
        return x['low']-1e-3
    elif x['pivot']==2:
        return x['high']+1e-3
    else:
        return np.nan

df['pointpos'] = df.apply(lambda row: pointpos(row), axis=1)

fig = go.Figure(data=[go.Candlestick(x=df.index,
                open=df['open'],
                high=df['high'],
                low=df['low'],
                close=df['close'])])

fig.add_scatter(x=df.index, y=df['pointpos'], mode="markers",
                marker=dict(size=5, color="MediumPurple"),
                name="pivot")
fig.show()

#グラフ２
# 移動平均線
df["SMA25"] = df["close"].rolling(window=25).mean()
# 標準偏差
df["std"] = df["close"].rolling(window=25).std()
# ボリンジャーバンド
df["2upper"] = df["SMA25"] + (2 * df["std"])
df["2lower"] = df["SMA25"] - (2 * df["std"])
df["3upper"] = df["SMA25"] + (3 * df["std"])
df["3lower"] = df["SMA25"] - (3 * df["std"])
# 非表示にする日付をリストアップ
d_all = pd.date_range(start=df['time'].iloc[0],end=df['time'].iloc[-1])
d_obs = [d.strftime("%Y-%m-%d") for d in df['time']]
d_breaks = [d for d in d_all.strftime("%Y-%m-%d").tolist() if not d in d_obs]

# figを定義
fig = make_subplots(rows=2, cols=1, shared_xaxes=True, vertical_spacing=0.05, row_width=[0.2, 0.7], x_title="Date")
 
# Candlestick 
fig.add_trace(
    go.Candlestick(x=df["time"], open=df["open"], high=df["high"], low=df["low"], close=df["close"], name="OHLC", showlegend=False),
    row=1, col=1
)

# SMA
fig.add_trace(go.Scatter(x=df["time"], y=df["SMA25"], name="SMA25", mode="lines"), row=1, col=1)

# ボリンジャーバンド
fig.add_trace(
    go.Scatter(x=df["time"], y=df["2upper"], name="2σ", line=dict(width=1, color="red")),
    row=1, col=1
)
fig.add_trace(
    go.Scatter(x=df["time"], y=df["2lower"], line=dict(width=1, color="red"), showlegend=False),
    row=1, col=1
)

fig.add_trace(
    go.Scatter(x=df["time"], y=df["3upper"], name="3σ", line=dict(width=1, color="blue")),
    row=1, col=1
)
fig.add_trace(
    go.Scatter(x=df["time"], y=df["3lower"], line=dict(width=1, color="blue"), showlegend=False),
    row=1, col=1
)

# Layout
fig.update_layout(
    title={
        "text": "日経平均の日足チャート",
        "y":0.9,
        "x":0.5,
    }
)
 
# y軸名を定義
fig.update_yaxes(title_text="株価", row=1, col=1)
fig.update_yaxes(title_text="出来高", row=2, col=1)
fig.update_yaxes(title_text="乖離率", row=3, col=1)
 
# 不要な日付を非表示にする
fig.update_xaxes(
    rangebreaks=[dict(values=d_breaks)]
)
 
fig.update(layout_xaxis_rangeslider_visible=False)
fig.show()

試したこと

line 156 のfig を新たに定義しているのがまずいかと思い、試行錯誤しました
定義を消すと、グラフ２はそれ以上表示されません。

/opt/homebrew/lib/python3.11/site-packages/_plotly_utils/basevalidators.py:105: FutureWarning:

The behavior of DatetimeProperties.to_pydatetime is deprecated, in a future version this will return a Series containing python datetime objects instead of an ndarray. To retain the old behavior, call `np.array` on the result

Traceback (most recent call last):
  File "/opt/homebrew/lib/python3.11/site-packages/plotly/basedatatypes.py", line 2338, in _validate_get_grid_ref
    raise AttributeError("_grid_ref")
AttributeError: _grid_ref

During handling of the above exception, another exception occurred:

Traceback (most recent call last):
  File "/Users/uta/Documents/code/fx/bb.py", line 163, in <module>
    fig.add_trace(
  File "/opt/homebrew/lib/python3.11/site-packages/plotly/graph_objs/_figure.py", line 900, in add_trace
    return super(Figure, self).add_trace(
           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/opt/homebrew/lib/python3.11/site-packages/plotly/basedatatypes.py", line 2108, in add_trace
    return self.add_traces(
           ^^^^^^^^^^^^^^^^
  File "/opt/homebrew/lib/python3.11/site-packages/plotly/graph_objs/_figure.py", line 980, in add_traces
    return super(Figure, self).add_traces(
           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/opt/homebrew/lib/python3.11/site-packages/plotly/basedatatypes.py", line 2238, in add_traces
    self._set_trace_grid_position(trace, row, col, secondary_y)
  File "/opt/homebrew/lib/python3.11/site-packages/plotly/basedatatypes.py", line 2329, in _set_trace_grid_position
    grid_ref = self._validate_get_grid_ref()
               ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/opt/homebrew/lib/python3.11/site-packages/plotly/basedatatypes.py", line 2340, in _validate_get_grid_ref
    raise Exception(
Exception: In order to reference traces by row and column, you must first use plotly.tools.make_subplots to create the figure with a subplot grid.

補足情報（FW/ツールのバージョンなど）

macOS

Answer 1

#グラフ１
import numpy as np
import pandas as pd
import plotly.graph_objects as go
from plotly.subplots import make_subplots
from scipy.stats import linregress
import matplotlib.pyplot as plt
import yfinance as yf
import matplotlib.dates as mdates
from datetime import datetime, timedelta
from pandas_datareader import data as web
import datetime as dt

def pivotid(df1, l, n1, n2): #n1 n2 before and after candle l
    if l-n1 < 0 or l+n2 >= len(df1):
        return 0

    pividlow=1
    pividhigh=1
    for i in range(l-n1, l+n2+1):
        if(df1.low[l]>df1.low[i]):
            pividlow=0
        if(df1.high[l]<df1.high[i]):
            pividhigh=0
    if pividlow and pividhigh:
        return 3
    elif pividlow:
        return 1
    elif pividhigh:
        return 2
    else:
        return 0

yf.pdr_override() # yfinanceライブラリでpandas_datareaderの関数をオーバーライド
start = dt.datetime.now() - dt.timedelta(hours=12)
end = dt.datetime.now()
symbol = 'USDJPY=X'
df = web.get_data_yahoo(tickers=symbol,start=start,end=end,period='12h',interval='1m')
df = df.sort_index()
df = df.reset_index(names='Gmt time')
df = df.drop(columns=['Adj Close', 'Volume'])
df.columns=['time', 'open', 'high', 'low', 'close']
df.reset_index(drop=True, inplace=True)
df.isna().sum()

# 無名関数（lambda関数）を定義しています。この関数は、DataFrameの各行を入力として受け取り、その行の名前（インデックス）を x.name としてアクセスします。
df['pivot'] = df.apply(lambda x: pivotid(df, x.name, 3, 3), axis=1)

def pointpos(x):
    if x['pivot']==1:
        return x['low']-1e-3
    elif x['pivot']==2:
        return x['high']+1e-3
    else:
        return np.nan

df['pointpos'] = df.apply(lambda row: pointpos(row), axis=1)

# figを定義
fig = go.Figure(data=[go.Candlestick(x=df['time'],
                open=df['open'],
                high=df['high'],
                low=df['low'],
                close=df['close'])])

fig.add_scatter(x=df['time'], y=df['pointpos'], mode="markers",
                marker=dict(size=5, color="MediumPurple"),
                name="pivot")

#グラフ２
# 移動平均線
df["SMA25"] = df["close"].rolling(window=25).mean()
# 標準偏差
df["std"] = df["close"].rolling(window=25).std()
# ボリンジャーバンド
df["2upper"] = df["SMA25"] + (2 * df["std"])
df["2lower"] = df["SMA25"] - (2 * df["std"])
df["3upper"] = df["SMA25"] + (3 * df["std"])
df["3lower"] = df["SMA25"] - (3 * df["std"])
# 非表示にする日付をリストアップ
d_all = pd.date_range(start=df['time'].iloc[0],end=df['time'].iloc[-1])
d_obs = [d.strftime("%Y-%m-%d") for d in df['time']]
d_breaks = [d for d in d_all.strftime("%Y-%m-%d").tolist() if not d in d_obs]

# SMA
fig.add_trace(go.Scatter(x=df["time"], y=df["SMA25"], name="SMA25", mode="lines"))

# ボリンジャーバンド
fig.add_trace(
    go.Scatter(x=df["time"], y=df["2upper"], name="2σ", line=dict(width=1, color="red")))
fig.add_trace(
    go.Scatter(x=df["time"], y=df["2lower"], line=dict(width=1, color="red"), showlegend=False))

fig.add_trace(
    go.Scatter(x=df["time"], y=df["3upper"], name="3σ", line=dict(width=1, color="blue")))
fig.add_trace(
    go.Scatter(x=df["time"], y=df["3lower"], line=dict(width=1, color="blue"), showlegend=False))

# Layout
fig.update_layout(
    title={
        "text": "日経平均の日足チャート",
        "y":0.9,
        "x":0.5,
    }
)
 
# y軸名を定義
fig.update_yaxes(title_text="株価")
 
# 不要な日付を非表示にする
fig.update_xaxes(
    rangebreaks=[dict(values=d_breaks)]
)

fig.update(layout_xaxis_rangeslider_visible=False)
fig.show()

Comments

[penpen88]

ご回答いただきまして、ありがとうございます。

melian さんのグラフですと、為替チャートにボリンジャーバンドを描いたものが上に、為替チャートにピボット点を描いたものが下に出てると思います。
いま、１つの為替チャートにボリンジャーバンドとピボット点を描きたく、分からなくなっている状況です。

そのように表示できないでしょうか？

[melian]

書き替えてみました。

[penpen88]

おそくなりました。ありがとうございます