Blazor Chart Example - Keyboard Navigation Accessibility Support

The Charts component supports keyboard navigation to enable efficient interaction with chart elements. Use the following keyboard shortcuts to perform various actions within the chart:

Focus Navigation

• Alt + J – Moves focus to the chart element.
• Tab – Navigates focus to the next element in the chart.
• Shift + Tab – Navigates focus to the previous element in the chart.

Data Point Selection

• Down arrow – Moves focus to the data point on the left side of the currently selected point.
• Up arrow – Moves focus to the data point on the right side of the currently selected point.
• Left arrow – Moves focus to the next series in the chart.
• Right arrow – Moves focus to the previous series in the chart.
• Enter / Space – Selects the current data point.
• Esc – Dismisses the tooltip for the current data point.

Legend Navigation

• Down arrow / Left arrow – Moves focus to the legend item on the left of the currently selected item.
• Up arrow / Right arrow – Moves focus to the legend item on the right of the currently selected item.
• Enter / Space – Toggles the visibility of the corresponding series.

Zoom and Pan

• Ctrl + + – Zooms in on the chart.
• Ctrl + - – Zooms out of the chart.
• Up arrow / Down arrow – Pans the chart vertically.
• Left arrow / Right arrow – Pans the chart horizontally.
• R – Resets the chart to its original zoom level.

Print

• Ctrl + P – Prints the Charts component.