Common properties

This page lists properties which are common across the plotting components.

Size and margins

• height: number – the height of the chart in pixels
• margin: object { top, bottom, left, right : number } – Margins of the area in which the chart is displayed, in pixels. The axes of the chart are drawn inside the margins, so setting the margins to zero will hide the axes. When specifying margin, all four sides must be set.

The width of the component is determined by the width of its parent components and the browser window. It can also be modified using CSS.

CSS

The className and style properties are available in most of the components with the same functionality as they have in React. See React documentation for more information.

• className: string – Name of the CSS class to be applied to the component.
• styles: object – Inline CSS to be applied to the component. The names of the propertiesare camel-cased (instead of standard CSS notation with hyphens).

Zoom

• zoomLevelMin, zoomLevelMax: number – Zoom level is the factor by which the chart is scaled (enlarged). These properties define the minimal and maximal value of zoom level which can be achieved using mouse wheel, touch pinch and zoom buttons in the chart’s toolbar. Brushing (selecting a region) can lead to even higher enlargement. It is not recommended to reduce the zoomLevelMin below 1.