Description
Hi! First and foremost, thanks for the excellent product.
I'm trying to make plots with lots (25+ subplots) and every 10th plot, the clip-url for the vrect shape appears to be generated incorrectly, leading to the vrect not getting clipped when the plot axes are dragged around:
See that the four rightmost plots have all been panned to the left, but the bottom right most plot (the 10th plot) doesn't properly clip the vrect:
I saw that the vrect's shape clip-url seems different every 10 entries:

if I update that to look like the rest (my coding abilities are pretty limited!) it seems to be fixed:

I haven't been able to suss out where exactly in the javascript this URL gets generated, my familiarity with the plotly codebase is quite limited.
Example code (I've been using plotly.py) for the above:
import plotly.graph_objects as go
from plotly.subplots import make_subplots
# Create a 5x5 subplot figure
fig = make_subplots(rows=5, cols=5)
# Define the data for each subplot
for i in range(5):
for j in range(5):
# Add a scatter plot to each subplot
fig.add_trace(
go.Scatter(
x=[1, 2, 3, 4],
y=[1, 3, 2, 5],
mode='lines+markers',
name=f'Subplot {i*5 + j + 1}'
),
row=i + 1,
col=j + 1
)
# Add vertical rectangles (vrect) to each subplot
for i in range(5):
for j in range(5):
fig.add_vrect(
x0=2, # x-coordinate of one side of the rectangle
x1=3, # x-coordinate of the other side of the rectangle
row=i + 1,
col=j + 1,
annotation_text=f"VRect {i*5 + j + 1}",
annotation_position="inside top right",
fillcolor="LightSkyBlue",
line=dict(color="RoyalBlue"),
exclude_empty_subplots=True
)
# Update layout
fig.update_layout(
title_text="25 Subplots with Vertical Rectangles (vrect)",
height=800,
width=800,
showlegend=False
)
# Show the figure
fig.show()