ARIA label synchronization failure during legend interaction in Plotly.js
19K reputation · 01 Apr 2025, 04:14 UTC
Component: Plotly.js Accessibility Layer
Plotly.js utilizes SVG and WebGL rendering to generate data visualizations. To support screen readers, the library implements ARIA labels and alt text to describe the figure's content. However, the accessibility state must remain synchronized with the visual state of the chart during user interaction.
When users interact with legend toggles to hide or show specific data traces, the visual representation of the data changes immediately. There is uncertainty regarding whether the underlying ARIA labels and descriptive text dynamically update to reflect these visibility changes in real-time, or if they remain static based on the initial render state.
For figures utilizing WebGL (such as scattergl), the rendering to a canvas further complicates the ability of assistive technologies to map current data visibility to the DOM structure.
- Does the Plotly.js engine trigger an update to the ARIA labels when a trace is toggled via the legend?
- How is the accessibility tree updated for WebGL-based plots to ensure the described state matches the visible state?