opensource-joe commented on issue #21544:
URL: https://github.com/apache/echarts/issues/21544#issuecomment-5300135540
Answering the direct question, since it has been open a while: **no, ECharts
does not currently meet WCAG 2.1 AA**, and the statement on the website is
narrower than it reads. It is accurate about what it claims, which is
ARIA-based description generation, but that is one success criterion out of the
several an AA claim covers.
I went through `src/visual/aria.ts` and `src/model/Global.ts` rather than
the docs. What the library actually does today:
**1. The ARIA description is opt-in, not automatic.** `Global.ts` only
enables it if `option.aria` is present:
```js
const airaOption = baseOption.aria;
if (isObject(airaOption) && airaOption.enabled == null) {
airaOption.enabled = true;
}
```
A chart configured without an `aria` block gets no `role` and no
`aria-label` at all. So the default experience for a screen reader user is an
unlabelled canvas. Worth saying plainly on the docs page, because "ECharts 4.0
complies with this specification" reads as automatic.
**2. When enabled, the whole chart is one flat label.** `setLabel()` does
`dom.setAttribute('role', 'img')` and puts a generated sentence in `aria-label`
on the container. That is a reasonable text alternative for **1.1.1 Non-text
Content**, and it is genuinely more than most charting libraries ship. But it
is a single string for the entire chart, so there is nothing to navigate, and
it is capped: `maxCount` defaults to **10 series and 10 data points**. A
30-series chart silently describes the first 10.
**3. Nothing in the chart is reachable by keyboard.** Legend items toggle
series, `dataZoom` is a control, `toolbox` has buttons. Under the canvas
renderer these are painted pixels with no accessible existence, and #21022
reports the same for legend items under the SVG renderer. That is **2.1.1
Keyboard** (Level A) and **4.1.2 Name, Role, Value** (Level A), not merely AA.
#18256 has been asking for exactly this since 2023.
**4. `aria.decal` is the strongest piece and is off by default.** Decal
patterns are a real answer to **1.4.1 Use of Color**, and shipping them at all
is ahead of the field. `decal.show` defaults to `false`, so it only helps those
who find it.
So the honest summary for anyone evaluating ECharts against 2.1 AA: partial
credit on 1.1.1, a good but off-by-default answer to 1.4.1, and open failures
at Level A on keyboard access and on name/role/value for interactive chart
elements. Level A gaps matter here because AA includes A.
Two things that might be useful, and I am happy to do either:
- **A documentation change that costs nothing and prevents the most
misreading.** The accessibility page could state that `aria` is opt-in, show
the minimal config, note the `maxCount` truncation, and scope the claim to
description generation rather than to WCAG conformance generally. I can send
that as a PR.
- **A written per-criterion audit** against 2.1 AA with a reproduction for
each finding, which would give the project something to prioritise from and
give evaluators an honest answer to point at. This is the shape of an ACR/VPAT
without claiming to be one.
Context for the offer rather than a credential: I ran the U.S. federal
government's open source program at Code.gov, brought that platform into
Section 508 compliance, and added automated accessibility testing to its CI.
Chart accessibility is one of the harder unsolved areas, and ECharts is further
along than most, which is precisely why the gap between the docs and the
behaviour is worth closing.
Would maintainers prefer the docs PR first, the audit first, or neither?
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
