Bode Plot <smart-bode-plot>

Accessibility Attributes

The BodePlot is drawn on a canvas, which is not accessible to a screen reader. What the canvas shows is therefore also available as text: the plot area carries a summary with the number of responses, the frequency range and, when they are shown, the gain and phase margins with their frequencies; the margins are also a status line under the plot, so a change of margin is announced; and the cursor readout lists the magnitude and phase of every response at the cursor frequency.

The following ARIA attributes are used inside the BodePlot:

• role="img" - set on the plot area that holds the canvas. A canvas has no readable structure, so the plot needs a text alternative; the legend and the readout outside it stay operable.
• aria-label - names the plot area with its title, the number of responses, the frequency range and the margins, for example "Bode plot Axis 2 speed loop, 2 responses from 100 mHz to 2 kHz, gain margin 30.44 dB at 74.93 Hz, phase margin 57.4° at 4.911 Hz". It is rewritten on every change of data or cursor.
• role="group" with an aria-label - set on the legend, so it is announced as one named group.
• role="status" - set on the margins line, so a margin that changes as the loop is tuned is announced without moving focus.
• aria-pressed - set on each response's legend button, true while the response is shown.
• aria-disabled - indicates that the graph is disabled.

Keyboard Interaction

The plot area and the legend are each one tab stop.

On the plot area:

• Left and Right arrow move the cursor along the frequency axis by one pixel of the view; with Shift, by ten.
• Home and End move the cursor to the ends of the axis.

In the legend, the arrow keys move between responses and Enter or Space hides or shows one.

With a pointer: click or drag on the plot to place the cursor.

Localization

All strings the BodePlot exposes to assistive technology come from its messages property, so they can be provided in the user's language. Set locale to select a language and add a language through messages. Assigning messages replaces the whole object, so include the existing languages when adding one: el.messages = Object.assign({}, el.messages, { de: pack }); If the built-in en pack is dropped, switching back to English shows raw message keys.

The BodePlot uses the following message keys:

• chartLabel, chartSummary, marginsSummary, noData
• magnitudeAxis, phaseAxis, frequencyAxis
• legendLabel, plotHidden
• marginsLabel, gainMargin, phaseMargin, noCrossing
• cursorLabel, cursorRow, cursorValue

German, French, Spanish and Chinese packs are included in the Smart.Industrial package. Strings that are also exposed as properties default to empty and fall back to the pack, so the default text stays translatable while an explicit property value takes precedence.

Additional information on WAI-ARIA for the SMART Framework can be found here.