IRootSettings

Type interface

Sources

IRootSettings is an interface: it describes a shape of data and is not imported on its own.

Properties

#accessible

Type undefined | false | trueDefault trueSince 5.3.0

Set to false to disable all accessibility features.

NOTE: once disabled, accessibility cannot be re-enabled on a live Root object.

#ariaLabel

Type undefined | stringSince 5.3.17

If set to some string, it will be used as inner <div> ARIA-LABEL.

Should be used in conjunction with focusable.

More info: Accessibility: accessibility of root element

#calculateSize

Type undefined | (dimensions: DOMRect) => ISize

A function that returns the width and height in pixels to draw the chart at, given the container's measured box. It runs when the chart is created and on every resize.

#focusable

Type undefined | false | trueDefault falseSince 5.3.17

If set to true, the parent inner <div> element will become a focusable element.

More info: Accessibility: accessibility of root element

#focusPadding

Type undefined | numberDefault 2Since 5.6.0

Distance between focused element and its highlight square in pixels.

#fontFamily

Type undefined | stringSince 5.20.2

Font family for all labels. It overrides the theme's, but not a fontFamily set on a label itself.

#fontSize

Type number | stringSince 5.20.2

Font size for all labels: a number in pixels, or a CSS size such as "1.2em". It overrides the theme's, but not a fontSize set on a label itself.

#fontWeight

Type "normal" | "bold" | "bolder" | "lighter" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900"Since 5.20.2

Font weight for all labels. It overrides the theme's, but not a fontWeight set on a label itself.

#forcedColors

Type undefined | false | trueDefault trueSince 5.21.0

Makes the chart's interface colors (labels, grid, axes, buttons) follow the system colors when the page is in a forced colors mode, such as Windows High Contrast, so they stay visible. Series colors are kept.

#renderer

Type IRendererClassSince 5.21.0

The renderer that draws the chart. Defaults to Root.defaultRenderer, which is CanvasRenderer unless changed.

To draw with SVG, use am5.SVGRenderer:

const root = am5.Root.new("chartdiv", {
  renderer: am5.SVGRenderer
});

var root = am5.Root.new("chartdiv", {
  renderer: am5.SVGRenderer
});

Can only be set when the Root is created.

#role

Type undefined | stringSince 5.3.17

Allows setting a "role" for the inner <div>.

More info: Accessibility: accessibility of root element

#sanitizeHTML

Type undefined | false | trueDefault trueSince 5.19.0

Cleans potentially malicious code out of HTML content (html and labelHTML settings, HTML tooltips, modals, export menu labels) before it goes on the page.

Turn it off only if you trust all HTML content: unsanitized HTML from untrusted data can lead to XSS attacks.

#tooltipContainerBounds

Type undefined | { bottom: number, left: number, right: number, top: number }Since 5.2.24

Extra space in pixels on each side of the chart where tooltips can still be drawn, letting them go outside the chart's container.

#useSafeResolution

Type undefined | false | trueDefault true

Draws the chart at a resolution of 1 on iOS and iPadOS devices instead of the screen's pixel ratio, to stay within their memory limits. Set to false for sharper charts there.