Highlights
WCAG 2.2 AA Accessibility Remediation
ApexCharts 5.11.0 ships a comprehensive accessibility overhaul targeting WCAG 2.2 Level AA conformance.
Keyboard & Focus
- Focused data points now expose
role="img"and a contextualaria-label(series name, formatted value, category). - Two-stage Escape: first press dismisses the tooltip, second press exits keyboard navigation (WCAG technique G194).
- Keyboard zoom/pan via
+/-/0andShift+Arrowas alternatives to drag gestures. - Toolbar hit targets enlarged to 24×24 CSS px minimum.
- Tooltip is biased away from the focused data point during keyboard navigation.
ARIA & Semantics
- SVG
<title>added alongside the existing<desc>; auto-generatedaria-labelincludes series names when no description is supplied. - Toolbar controls migrated from
div[role=button]to native<button type="button">(first rule of ARIA) - Visually-hidden
role="status" aria-live="polite"region announces zoom/pan/reset actions to screen readers.
Visual & Motion
- New
--apexcharts-focus-colorCSS custom property, themed for light (#008FFB), dark (#FFD500), and high-contrast (#FFFF00) modes — fixes SC 1.4.11 / 2.4.7. Utils.getContrastRatio()WCAG luminance helper added; high-contrast palette validated ≥ 3:1 against#fffin automated tests — fixes SC 1.4.3 / 1.4.11.@media (prefers-reduced-motion: reduce)shrinks all chart animations to near-zero duration — fixes SC 2.2.2.
Tests added: contrast.spec.js, keyboard-trap.spec.js (Playwright), keyboard-zoom.spec.js (Playwright), extended accessibility.spec.js and keyboard-navigation.spec.js.
Improved Tooltip Hit Detection for Line / Area Charts
closestInMultiArray now projects the cursor onto each consecutive line segment rather than measuring distance to the nearest marker. This makes clicking between two markers on a line or area chart reliably pick the correct series — previously, whichever series's marker happened to be closest to the empty space was selected, often giving wrong results when many series clustered together. Bar, scatter, and other non-line chart types retain the existing marker-distance logic.
Bug Fixes
-
Tooltip —
shared: falseon line charts (#4983):closestInMultiArraywas ignoring Y distance wheneverallSeriesHasEqualXwastrue, causing a tie across all series so the lowest-index series always won. The X-only fast path is now restricted toshared: true; full Euclidean distance is used otherwise, so the actually-hovered series is correctly identified. -
Tooltip —
shared: truemarkerClick: Line chart withshared: truenow correctly reports the clicked series index in themarkerClickevent callback. -
Focus outline on mouse click: Removed the focus outline that incorrectly appeared around the entire chart container on mouse click; focus styles are now shown only during keyboard navigation.