문서 › 상호작용과 내보내기
접근성
키보드로 값 읽기, 자동 요약, 숨긴 표, 움직임 줄이기.
82chart는 따로 설정하지 않아도 스크린리더와 키보드로 읽을 수 있습니다. 무료 라이브러리 중에서는 드문 부분입니다.
자동 요약
바깥 요소는 role="figure" 이고 aria-label 에 요약이 들어갑니다. 예: "선 차트, 월별 방문자. 시리즈 2개. 1월~10월. 올해: 최고 80,100명(10월), 최저 41,200명(1월) …". description 옵션을 주면 그 문장이 앞에 붙습니다.
키보드
| 키 | 동작 |
|---|---|
| Tab | 차트로 들어가면 첫 값에 툴팁 |
| ← / → | 앞뒤 x로 (가로 막대는 ↑/↓) |
| ↑ / ↓ | 다른 시리즈로 |
| Home / End | 처음 / 마지막 값 |
| Enter / Space | 그 점을 누른 것과 같음 (click 이벤트) |
| Esc | 툴팁 닫기 |
| + / - / 0 | 확대 / 축소 / 원래대로 (zoom: true) |
툴팁 내용은 aria-live 영역으로도 읽어 줍니다. 범례 항목은 aria-pressed 가 있는 버튼이고, ⋯ 메뉴는 화살표 키와 Esc로 움직입니다.
표와 움직임
- 모든 값이 든
<table>이 화면에 보이지 않게 늘 들어 있습니다.table: true면 보이게 놓습니다. - 운영체제의 "동작 줄이기"(
prefers-reduced-motion)가 켜져 있으면 처음 그릴 때의 애니메이션을 하지 않습니다.animation: false로 직접 끌 수도 있습니다. - 고대비 모드(
forced-colors)에서는 선을 시스템 글자색으로 그립니다. - 색만으로 구분하지 않도록, 점선 시리즈(
dashed)와 점 모양(pointShape)을 함께 쓰세요.