# chart2music
> Turns charts into music so the blind can hear data
Latest version **1.20.0** (published 2025-12-03) · MIT license · 0 weekly downloads
## Install
```sh
npm install chart2music
pnpm add chart2music
yarn add chart2music
bun add chart2music
```
## Health
**Score 60/100 (C)** — status: stable.
Positive: has types; esm support; no vulnerabilities; high quality score.
Warnings: low downloads.
## Facts
| | |
|---|---|
| Version | 1.20.0 |
| Published | 2025-12-03 |
| First published | 2022-07-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 927.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | julianna-langston |
| Keywords | a11y, accessibility, audio, audio graph, chart, dataviz, data visualization, graph, screen reader, sonification |
## Links
- npm: https://www.npmjs.com/package/chart2music
- Repository: https://github.com/julianna-langston/chart2music
- Homepage: https://www.chart2music.com
- Issues: https://github.com/julianna-langston/chart2music/issues
- npm.io page: https://npm.io/package/chart2music
## Dependencies (1)
- [@formatjs/intl](https://npm.io/package/@formatjs/intl.md) 3.1.6
## Alternatives
- [d3-force-3d](https://npm.io/package/d3-force-3d.md) — 1.0M weekly downloads
- [ng2-charts](https://npm.io/package/ng2-charts.md) — 486.8K weekly downloads
- [@arcgis/core](https://npm.io/package/@arcgis/core.md) — 257.8K weekly downloads
- [react-sparklines](https://npm.io/package/react-sparklines.md) — 249.3K weekly downloads
- [react-native-gifted-charts](https://npm.io/package/react-native-gifted-charts.md) — 182.3K weekly downloads
## Recent versions
- 1.20.0 (latest) — 2025-12-03
- 1.19.0 — 2025-04-27
- 1.18.1 — 2025-03-23
- 1.18.0 — 2024-11-12
- 1.17.0 — 2024-05-10
- 1.16.3 — 2024-04-26
- 1.16.2 — 2024-04-14
- 1.16.1 — 2024-04-04
- 1.16.0 — 2024-03-29
- 1.15.1 — 2024-02-28
- 1.15.0 — 2024-02-28
- 1.14.0 — 2024-02-03
- 1.13.0 — 2024-01-17
- 1.12.2 — 2023-10-04
- 1.12.1 — 2023-09-29
- … 38 more at https://npm.io/package/chart2music/versions
## README
# Chart2Music
Chart2Music turns charts into music so the blind can hear data.
[](https://badge.fury.io/js/chart2music)
[](https://snyk.io/test/github/julianna-langston/chart2music)
[](https://codecov.io/gh/julianna-langston/chart2music)
## Key features
* **Inclusively designed** - The dev team behind C2M includes blind people in the design, development, and testing stages.
* **Accessibility for screen reader users** - Enables blind users to quickly absorb information about charts and graphs using sound and exploration.
* **Easier maintenance for accessibility requirements** - Traditionally, charts and graphs would be made accessible using alt text, which can be difficult to generate or maintain, or data tables, which provide a poor end user experience. C2M provides an *automated* solution while *enhancing* the user experience.
* **Visual agnostic** - Use C2M alongside your charts, regardless of how your visuals were created. ChartJS? D3.js? An image? C2M works in parallel with your visuals.
* **Use anywhere, for free** - C2M is [MIT licensed](https://github.com/julianna-langston/chart2music/blob/main/LICENSE), so you can integrate into anything - personal, commercial, government, etc.
## Getting started
Include the following script tag on your page:
```html
```
On your page, you will also need your chart. For the sake of simplicity, here's an example with an image and an element for screen reader text:
```html
```
Now, in your javascript, you can start a new instance of Chart2Music. In this example, we will include a simple bar chart, and point it to the img element above.
```javascript
const {err} = c2mChart({
type: "bar",
element: document.getElementById("MyChart"),
cc: document.getElementById("screenReaderText"),
data: [1,2,3]
});
// If there was an error in generating the chart, print the error message
if(err){
console.error(err);
}
```
What will the user experience be? When the user navigates to the image, a description will be automatically generated, telling the user that there is interaction available. Then, the user can use arrow keys or keyboard shortcuts to interact with the data.
## Advanced
For code examples in action, see the [Chart2Music Examples collection on Codepen](https://codepen.io/collection/BNedqm).
Some of the examples you will find there include:
* [Simple, no frills code example](https://codepen.io/chart2music/pen/ExEmqbr).
* [Multi-line plot](https://codepen.io/chart2music/full/gOegZpm).
* [Bar-line plot](https://codepen.io/chart2music/full/QWmdpOJ).
* [Candlestick](https://codepen.io/chart2music/full/rNvqBYL).
You can also find examples of integrations with other visualization libraries:
* [with Chart.js](https://codepen.io/chart2music/full/YzaVxPK)
* [with D3.js](https://codepen.io/chart2music/full/gOezOaY)
* [with ChartIQ](https://jsfiddle.net/chart2music/34bw2eqm/81/)
* [with HighCharts](https://codepen.io/chart2music/full/QWmZrKj)
* [with Recharts](https://codepen.io/chart2music/full/eYrrRam)
* [with Google Charts](https://codepen.io/chart2music/full/abYGoBJ)
* [with AnyChart](https://codepen.io/chart2music/full/abYGoME)
* [with Chartist.js](https://codepen.io/chart2music/full/LYdmPNj)
* [with NVD3.js](https://codepen.io/chart2music/full/jOzxNQW)
* [with Plotly.js](https://codepen.io/chart2music/full/BarrXYr)
* [with AM Charts](https://codepen.io/chart2music/full/MWGGZPe)
* [with Vega-Lite](https://codepen.io/chart2music/full/jOzpyME)
* [with Morris.js](https://codepen.io/chart2music/full/abYGobm)
* [with Frappe](https://codepen.io/chart2music/full/QWmrWWE)
Go to [chart2music.com](https://www.chart2music.com) for the full tutorial.
---
_Source: https://npm.io/package/chart2music · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._