ParaCharts Documentation

Welcome to the paracharts documentation. This site contains information on how to get the most out of ParaCharts as an end-user, as well as developer documentation.

ParaCharts exists to close a persistent accessibility gap in online data visualization: many published charts are still visual-first and mouse-first. ParaCharts is built so chart insight is also available through keyboard interaction, screen-reader announcements, self-voicing, and sonification.

Start Here

• Getting Started: what ParaCharts does, how it works, and a minimal first integration.
• Implementation & Testing Guide: how to add charts, wire monthly live data updates, and validate accessibility behavior.
• GitHub Pages Showcase: what can be effectively demonstrated on GitHub Pages and how to use GitHub workflows and Copilot around it.
• Example Gallery: live chart examples with copyable manifests and interpretation prompts.

User Guide

• Chart Types: overview of chart types.
• Control Panel & Settings: quick guide to the control panel tabs and common settings.
• Shortcuts & Commands: full keyboard reference and flows.
• Accessibility Features: disability-focused affordances, expected outcomes, and testing steps.

Quick Workflow

1. Start with Getting Started and load one manifest.
2. Use Implementation & Testing Guide to add a page or data source.
3. Validate behavior using the accessibility test matrix in Accessibility Features.
4. Compare your output to the live patterns in Example Gallery.

Developer Guide

• Custom Elements: the para-chart and para-chart-ai elements.
• Manifest: a description of the manifest format used by ParaCharts.
• Settings object: the settings property of a ParaChart element.

Experimental

• Haptics Lab: exploratory page for evaluating tactile feedback (Web Vibration API) as a complement to chart sonification.