Introduction
Getting Started
Vue 2 End of Support
Vue Wrappers End of Life
Native Components
Wrapper Components
- Introduction
- Barcodes
- Buttons
- Charts
- Chat
- DataSource
- Date Inputs
- Diagram
- Dialog
- Dropdowns
- DropDownTree
- Editor
- Gantt
- Gauges
- - Overview
  - ArcGauge
  - LinearGauge
  - RadialGauge
  - API
- Grid (wrapper)
- Inputs
- Layout
- List Views
- ListBox
- Map
- MediaPlayer
- PivotGrid
- Popups
- Scheduler
- ScrollView
- Spreadsheet
- TreeList
- TreeMap
- TreeView
- Upload
- Validator
- Window
- Framework & Features
- Globalization
- Troubleshooting
- Using Wrapper Components in Vite
Sample Applications
Styling & Themes
Common Features
Project Setup
Knowledge Base
Changelog
FAQ
Troubleshooting

Components / Gauges / API / ArcGauge API /

New to Kendo UI for Vue? Start a free 30-day trial

ArcGauge

Directive

kendo-arcgauge

Child Components

kendo-arcgauge-color

Props

center-template `String | Function`

The label template (centerTemplate in Kendo UI for jQuery). The template supports the value variable which represents the value.

color `String`

The color of the value pointer (color in Kendo UI for jQuery). Accepts any valid CSS color string, including hex and rgb.

colors `Array`

The color ranges of the value pointer (colors in Kendo UI for jQuery). The pointer color will be set to the color from the range that contains the current value.

gauge-area `Object`

The configuration options for the Gauge area—the entire visible area of the Gauge (gaugeArea in Kendo UI for jQuery). The supported composite props are available in GaugeAreaProps.

opacity `Number`

The opacity of the value pointer (opacity in Kendo UI for jQuery).

render-as `String`

Sets the preferred rendering engine (renderAs in Kendo UI for jQuery).

If not supported by the browser, the Gauge will switch to the first available mode.

The supported values are:

svg—Renders the RadialGauge as an inline SVG document if available.
canvas—Renders the RadialGauge as a canvas element if available.

scale `Object`

Configures the scale (scale in Kendo UI for jQuery). The supported composite props are available in ScaleProps.

theme `String`

The theme of the ArcGauge (theme in Kendo UI for jQuery).

theme can be either a built-in theme or a sass theme. When theme is set to sass, the Diagram will read the variables from the SASS-based themes.

The supported values are:

sass—A special value.
black
blueopal
bootstrap
default
highcontrast
metro
metroblack
moonlight
silver
uniform

transitions `Boolean`

A value which indicates if the transition animations will be played (transitions in Kendo UI for jQuery).

value `Number`

The value of the ArcGauge (value in Kendo UI for jQuery).

Methods

For more details about the methods available in the component's API please check its Kendo UI for jQuery API documentation.

kendoWidget

returns

Returns the Kendo UI ArcGauge instance.