[charts] Audio rendering of charts

[oliviertassinari]

Summary

Sonification of charts seems to be a relatively mature space.

Examples

• https://www.highcharts.com/blog/accessibility/
• https://github.com/julianna-langston/chartjs2music
• https://developer.apple.com/documentation/Accessibility/audio-graphs

Motivation

I saw in HTTPArchive/httparchive.org#963 (comment) that this feature was a bottleneck to move from Highcharts to Chart.js. So added it in https://www.notion.so/mui-org/Barry-Pollard-Google-HTTP-Archive-2f2cbfe7b6608078bc19db9d3cfdef04?v=2e9cbfe7b66080fd85c8000cdc5b86f7 and created this issue as waiting for upvotes. Maybe it's something that our enterprise users would want enough for us to prioritize.

Search keywords: -

[alexfauquette]

I agree we shoudl track this feature, but would not give it too much importance for now

The comment you linked is a good source of inspiration for a11y, but I don't see any mention of audio rendering. Here are the main points

1. Linking the charts with alt-text or a table
2. Keyboard nav to navigate from left to right and from line to lines (https://mui.com/x/react-charts/accessibility/#keyboard-support)
3. SVG let end-user cutomize the color as they want thanks to CSS
4. More common use case could be increasing font-size. If the base font-size is increased by the user, text in the svg using relative units will scale up, the canvas text in the example doesn't.
5. Styling the markers and tooltips (having a different shape per series to help color blind users)