Help: Drawing Arrows from Point in one Subplot to Another

📊 Plotly Python
1

I’m trying to draw an arrow from a point in one subplot to a point in another subplot. The plots in question are in plotly in a Streamlit interface. So far I’ve tried something like this:

import streamlit as st
import plotly.graph_objects as go
from plotly.subplots import make_subplots

st.set_page_config(layout="wide")
st.title("Minimal Arrow Test")

fig = make_subplots(rows=2, cols=1, shared_xaxes=True)

fig.add_trace(
    go.Scatter(x=[2], y=[2], mode='markers', marker=dict(size=10, color='blue'), name='Top Plot Marker'),
    row=1, col=1
)
fig.add_trace(
    go.Scatter(x=[1], y=[1], mode='markers', marker=dict(size=10, color='green'), name='Bottom Plot Marker'),
    row=2, col=1
)

fig.add_annotation(
    x=2, y=2,
    ax=1, ay=1,
    xref='x',
    yref='y',      # Target the top plot's y-axis
    axref='x',
    ayref='y2',    # Target the bottom plot's y-axis
    showarrow=True,
    arrowhead=2,
    arrowsize=1.5,
    arrowwidth=2,
    arrowcolor="red",
    text="Arrow from y2 to y1"
)

fig.update_layout(
    height=600,
    title_text="Test."
)

st.plotly_chart(fig, use_container_width=True)

The result I get always has the arrow start and end in the same y-axis. The arrow never points to the second sub-plot. I asked Gemini for help, and first it hallucinated a webpage in the plotly documentation that doesn’t seem to be there:

Then it assured me that I’m the crazy one: “Let me be very clear: Yes, the ability to draw an arrow between two different subplots absolutely exists in Plotly and is a standard feature.”

Can someone settle this debate between me and a very confident machine? Thanks in advance for your help.

1 Like