New to KendoReact? Start a free 30-day trial

ArcGauge

Component

Definition

Package:@progress/kendo-react-gauges

Properties Interface:ArcGaugeProps

Properties

centerRender?

A function that renders the center template of the Gauge.

Parameters:valuenumbercolorstringReturns:

ReactElement<any, string | JSXElementConstructor<any>>

children?

ReactNode

Determines the children nodes.

className?

string

Sets additional CSS classes to the component.

color?

string

The color of the value pointer. Accepts a valid CSS color string, including hex and rgb.

colors?

ColorRange[]

The color ranges of the value pointer (see example).

dir?

string

Represents the dir HTML attribute.

opacity?

number

The opacity of the value pointer.

renderAs?

"svg" | "canvas"

Sets the preferred rendering engine. If not supported by the browser, the Gauge switches to the first available mode.

The supported values are:

"svg"—If available, renders the component as an inline .svg file.
"canvas"—If available, renders the component as a canvas element.

scale?

ArcScale

The scale options of the ArcGauge.

style?

CSSProperties

The styles that are applied to the component.

transitions?

boolean

If set to true, the Gauge plays animations when it displays the series. By default, animations are enabled.

value

number

The value of the Gauge.

Accessors

element

null | HTMLDivElement

The DOM element of the Gauge.

surface

null | Surface

The Drawing Surface of the Gauge.

Methods

exportVisual

Exports a Gauge component as a Drawing Scene.

Parameters:options?any

The parameters for the export operation.

Returns:

Promise<Group>

A promise that returns the root Group of the scene.