Skip to content

fix: Convert CSS color specifiers to rgba in gl traces - #8119

Open
camdecoster wants to merge 3 commits into
mainfrom
cam/8116/convert-css-specifiers-rgba-gl-traces
Open

camdecoster wants to merge 3 commits into
mainfrom
cam/8116/convert-css-specifiers-rgba-gl-traces

Conversation

@camdecoster

@camdecoster camdecoster commented Oct 14, 2026 •

Copy link
Copy Markdown
Contributor

Description

Convert CSS color specifiers to rgba before passing them to regl libraries to avoid issues with syntax compatibility.

Closes #8116.

Changes

  • Convert color specifiers
  • Add tests

Screenshots

Before After
image image

Testing

  • Be on main
  • Open Plotly devtools and paste the following into the browser devtools console:
    const c = 'oklch(0.7 0.15 30)';
    const trace = {
        x: [1, 2, 3], y: [1, 3, 2], mode: 'lines+text', text: ['a', 'b', 'c'], textposition: 'top center',
        line: { color: c, width: 4 }, fill: 'tozeroy', fillcolor: c, textfont: { color: c, size: 20 },
        error_y: { array: [0.5, 0.5, 0.5], color: c, thickness: 3 }
    };
    Plotly.newPlot(gd, [
        { ...trace, type: 'scatter', name: 'scatter' },
        { ...trace, type: 'scattergl', name: 'scattergl', xaxis: 'x2', yaxis: 'y2' }
    ], { grid: { rows: 1, columns: 2, pattern: 'independent' }, width: 800, height: 400 });
  • Note that the scattergl trace has the incorrect color
  • Switch to this branch
  • Run the snippet again
  • Note that the scattergl trace has the correct color

Notes

  • The underlying regl libraries that these traces use rely on an older color parsing library that doesn't parse modern CSS color specifiers (color-normalize v1.5.2)
  • plotly.js already has the feature to convert modern specifiers to rgba, so I did that here

@camdecoster
camdecoster marked this pull request as ready for review October 14, 2026 12:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG]: scattergl renders line.color, fillcolor, error_x.color, error_y.color, and textfont.color incorrectly with modern CSS color spaces

1 participant