ScatterGL alignment fails above height=8190

[Lxstr]

Below this height everything works fine. Above this height the alignment of scatterGL marks to tickmarks( or grid lines) completely fails. There is no issue with svg scatter.

height=8180:

height=8500:

Code:

import plotly.graph_objects as go
from dash import dcc
import numpy as np
import dash

app = dash.Dash(__name__)

app.layout = dcc.Graph(id="figure", figure={})

y_values=list(range(1, 353))
scatter_trace = go.Scatter(
    x=np.zeros(353),
    y=y_values,
    showlegend=False,  # Exclude this trace from the legend
    mode="markers"
)
layout = go.Layout(
    height=8500,
)
fig = go.Figure(data=[scatter_trace], layout=layout)

fig.update_yaxes(
    range=[0, len(y_values)],
    tickvals=y_values,
)

app.layout.figure = fig

if __name__ == "__main__":
    app.run_server(debug=True)

Versions:
name : plotly
version : 5.15.0

name : dash
version : 2.11.1

[alexcjohnson]

This is a fundamental browser-dependent limit to WebGL rendering plotly/plotly.js#4339 - see stats for your browser at https://webglreport.com/?v=2

@archmoj during your upcoming WebGL work maybe it would be worth trying to detect this and log a warning? If we want to go further we could try to render into a smaller buffer and stretch it with CSS... but that would be a major effort and quality would suffer anyway.