Home

AudioChart

Build Status

Allows the user to explore charts on web pages using sound and the keyboard rather than, or in conjunction with, visually and with the mouse. The code can easily be added to any page containing charts.

AudioChart uses the Web Audio API, which is supported by modern browsers, including Microsoft Edge (but not Internet Explorer).

Thanks to The Sonification Handbook for the research behind it and to The Paciello Group for allowing me to share this with you.

Use Cases

What does it let your users do?

  • Play an auditory version of the data represented by a chart.
  • Use the keyboard to pause the playback and move around the chart.

What sort of charts/data does it work with?

  • Google Charts line and bar charts.
  • C3 line charts.
  • Raw JSON data.
  • HTML tables.

The examples gallery covers using AudioChart with Google Charts, JSON and HTML tables.

Examples and Documentation

Development

Current and planned work is documented and discussed in the AudioChart issue tracker on GitHub.

Development is carried out in a test-driven manner. When building the software locally, unit tests are run in Chrome and Firefox via the npm scripts (Husky ensures they are run before a commit). The unit tests are also run on Travis (where Headless Chrome is used). You can view the test coverage details. In addition, internal API documentation is available.

Warning: AudioChart is still fairly early in development, so the APIs are changing quite fast.

Setting up for development

The build process uses npm and therefore also Node. You can get set up for development as follows (most of these instructions require the use of a command line).

  1. Install Node (if you're a Mac user doing this via Homebrew is recommended: brew install node).
  2. Get AudioChart's code by using git clone https://github.com/matatk/audiochart.git or downloading a ZIP of the latest code.
  3. Locally install AudioChart's dependencies by running npm install in the newly-cloned/extracted audiochart/ directory (the packages will be stored inside node_modules/).
  4. Issuing npm run build will lint the code, run the tests and make a minified production version.

Windows users: this has not yet been extensively tested on Windows, but it doesn't use anything platform-specific, so should work fine. Please file a bug if you encounter any problems.