Accessibility in Angular Sankey component
18 Nov 20183 minutes to read
The Sankey component follows accessibility guidelines and standards, including ADA, Section 508, WCAG 2.2, and relevant WAI-ARIA roles.
Accessibility compliance
| Accessibility Criteria | Compatibility |
|---|---|
| WCAG 2.2 Support |  |
| Section 508 Support | |
| Screen Reader Support | |
| Right-To-Left Support | |
| Color Contrast | |
| Mobile Device Support | |
| Keyboard Navigation Support | |
| Accessibility Checker Validation | |
| Axe-core Accessibility Validation | |
- All features of the component meet the requirement.
- Some features of the component do not meet the requirement.
- The component does not meet the requirement.WAI-ARIA attributes
The Sankey component uses WAI-ARIA patterns and attributes to improve accessibility.
Common attributes include semantic roles and ARIA attributes.
Additional ARIA roles and attributes used:
- img (role)
- button (role)
- region (role)
- aria-label (attribute)
- aria-hidden (attribute)
- aria-pressed (attribute)
Keyboard interaction
Keyboard navigation follows standard guidelines to move focus between nodes and links.
The following keyboard shortcuts are supported:
| Press | To do this |
|---|---|
| Alt + J | Moves the focus to the Sankey Chart element. |
| Tab | Moves the focus to the next element in the chart. |
| Shift + Tab | Moves the focus to the previous element in the chart. |
| Down Arrow | Moves the focus to the node or link below from the selected element. |
| Up Arrow | Moves the focus to the node or link above from the selected element. |
| Left Arrow | Moves the focus to the next node or link from the selected element. |
| Right Arrow | Moves the focus to the previous node or link from the selected element. |
| ESC | Cancel the tooltip for the node or link. |
| Ctrl + P | Prints the Sankey Chart. |
Ensuring accessibility
The Sankey component’s accessibility levels are ensured through an accessibility-checker and axe-core software tools during automated testing.
The accessibility compliance of the Sankey component is shown in the following sample. Open the sample in a new window to evaluate the accessibility with accessibility tools.