Accessible SVG Charts with AChart

Keith Andrews*, Christopher Kopel

*Corresponding author for this work

Research output: Chapter in Book/Report/Conference proceedingConference paperpeer-review

Abstract

AChart is a suite of open-source web-based tools written in TypeScript with Node.js to create and interpret semantically-enriched SVG-based accessible charts. AChart Creator is a command-line tool which generates accessible SVG charts from CSV files using the D3 framework, by injecting ARIA roles and properties from the AChart taxonomy. AChart Interpreter is a client-side web application and executable package which interprets such a semantically-enriched SVG chart and displays side-by-side graphical and textual versions of the chart. It can read out the chart using synthetic speech and its user interface is screen reader compatible. It can be used both by blind users to gain an understanding of a chart, as well as by developers and chart authors to verify the accessibility markup of an SVG chart. AChart Summariser is a command-line tool which interprets an accessible SVG chart and outputs a textual summary of the chart. AChart currently supports bar charts, line charts, and pie charts.

Original languageEnglish
Title of host publicationProceedings 1st Workshop on Accessible Data Visualization (AccessViz 2024)
PublisherIEEE Computer Society
Pages5-8
Number of pages4
ISBN (Electronic)979-8-3315-1731-1
DOIs
Publication statusPublished - 13 Oct 2024
Event1st Workshop on Accessible Data Visualization, AccessViz 2024 - Virtual, St Pete Beach, United States
Duration: 13 Oct 202413 Oct 2024
https://accessviz.github.io

Workshop

Workshop1st Workshop on Accessible Data Visualization, AccessViz 2024
Abbreviated titleAccessViz
Country/TerritoryUnited States
CitySt Pete Beach
Period13/10/2413/10/24
Internet address

Keywords

  • data visualisation
  • charts
  • accessibility
  • WAI-ARIA roles and properties for SVG
  • open-source
  • web-based
  • TypeScript
  • JavaScript
  • D3
  • speech output
  • screen reader

Fingerprint

Dive into the research topics of 'Accessible SVG Charts with AChart'. Together they form a unique fingerprint.

Cite this