Plotly: Annotate using secondary y-axis

Question

I have taken an expamle from plotly. And modified it so that the second trace plots on a secondary_y axis. I want to annotate a point on that line using the secondary axis as reference.

Here is the code:

import plotly.graph_objects as go

fig = make_subplots(specs=[[{"secondary_y": True}]])

fig.add_trace(go.Scatter(
   x=[0, 1, 2, 3, 4, 5, 6, 7, 8],
   y=[0, 11, 31, 21, 41, 31, 41, 61, 51]
))

fig.add_trace(go.Scatter(
   x=[0, 1, 2, 3, 4, 5, 6, 7, 8],
   y=[0, 4, 5, 1, 2, 2, 3, 4, 2]
), secondary_y=True)

fig.add_annotation(
       x=2,
       y=5,
       xref="x",
       yref="y",
       text="max=5",
       showarrow=True,
       font=dict(
           family="Courier New, monospace",
           size=16,
           color="#ffffff"
           ),
       align="center",
       arrowhead=2,
       arrowsize=1,
       arrowwidth=2,
       arrowcolor="#636363",
       ax=20,
       ay=-30,
       bordercolor="#c7c7c7",
       borderwidth=2,
       borderpad=4,
       bgcolor="#ff7f0e",
       opacity=0.8
       )

fig.update_layout()

This is what comes out, the annotation should be on the second line.

Answer 1

You just need to replace yref="y" with yref="y2" in fig.add_annotation():

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

fig = make_subplots(specs=[[{"secondary_y": True}]])

fig.add_trace(go.Scatter(
   x=[0, 1, 2, 3, 4, 5, 6, 7, 8],
   y=[0, 11, 31, 21, 41, 31, 41, 61, 51]
))

fig.add_trace(go.Scatter(
   x=[0, 1, 2, 3, 4, 5, 6, 7, 8],
   y=[0, 4, 5, 1, 2, 2, 3, 4, 2]
), secondary_y=True)

fig.add_annotation(
       x=2,
       y=5,
       xref="x",
       yref="y2",
       text="max=5",
       showarrow=True,
       font=dict(
           family="Courier New, monospace",
           size=16,
           color="#ffffff"
           ),
       align="center",
       arrowhead=2,
       arrowsize=1,
       arrowwidth=2,
       arrowcolor="#636363",
       ax=20,
       ay=-30,
       bordercolor="#c7c7c7",
       borderwidth=2,
       borderpad=4,
       bgcolor="#ff7f0e",
       opacity=0.8
       )

fig.show()