Polar Plot <smart-polar-plot>

Accessibility Attributes

The PolarPlot 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 plots, the radius range and where the largest radius is; every marker is listed under the plot with its radius and angle; and the cursor readout lists the radius of every plot at the cursor angle. Moving the cursor with the keyboard updates the readout, so a value is taken from the plot by its angle.

The following ARIA attributes are used inside the PolarPlot:

• 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 plots, the radius range and the largest radius, for example "Polar plot Bearing 2, orbit, 2 plots, radius 0 µm to 120 µm, largest 61.2 µm at 23.4°". It is rewritten on every change of data.
• role="group" with an aria-label - set on the legend, so it is announced as one named group.
• 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:

• The arrow keys move the cursor by one degree (or the equivalent in radians); with Shift, by ten.
• Home returns the cursor to angle zero.

In the legend, the arrow keys move between plots 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 PolarPlot 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 PolarPlot uses the following message keys:

• chartLabel, chartSummary, noData
• legendLabel, plotHidden
• markersLabel, marker
• 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.