✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚾️ It's finally Baseball season! Root for the home team... & Register for our Sports Analytics Webinar!

Annotations & shapes during resize

Below are two screen shots of the same graph and the code used to produce that graph. The second screenshot is just the same graph in a smaller browser window.

I’d like to make a graph where the line extending from the annotation (“One Quarter” and “Three Quarters”) begins right after the annotiton and extends to the end of the xrange. If the window is resized, I’d like the line to shorten but the annotation and the beginning of the line to stay fixed. How can I do this?

import datetime
import plotly.graph_objects as go

today=datetime.datetime.now()
xvals=[today,today+datetime.timedelta(days=1),today+datetime.timedelta(days=2)]
yvals=[0,50,100]

fig = go.Figure()
fig.add_trace(
    go.Scatter(
        x=xvals,
        y=yvals,
        showlegend=False,
    ),
)

fig.update_layout(
    go.Layout(
        title_font_size=13,
        yaxis=dict(
            ticks="outside",
            tickwidth=1,
            tickcolor='white',
            ticklen=7,
            tickmode='array',
            tickvals=[0, 25, 50, 75, 100],
            fixedrange=True,
            showgrid=False,
            range = [0, 100],),
        xaxis=dict(
            tickmode="linear",
            nticks=6,
            ticks="outside",
            tickwidth=1,
            tickcolor='black',
            ticklen=7,
            showline=True,
            linewidth=1,
            fixedrange=True,
            showgrid=False,
            range=[min(xvals),max(xvals)],
        ),
    ),
)

color = "black"
yvals=[0.25,0.75]
text=["One Quarter", "Three Quarters"]
for y,t in zip(yvals,text):
    fig.add_shape(
        type="line",
        xref="paper",
        yref="paper",
        x0=0.1,
        y0=y,
        x1=1,
        y1=y,
        layer="below",
        line=dict(
            color=color,
            width=3,
            dash="solid",
        )
    )

    fig.add_annotation(
        xref="paper",
        yref="paper",
        x=0,
        y=y,
        text=t,
        showarrow=False,
        yshift=0,
        font_color=color,
    )

fig.show()