CircularGauge Overview

The CircularGauge represents a value on a circular scale. It allows you to visualize numeric values in an attractive manner that matches the other widgets on the page.

The widget supports full customization of the Center Text, as well as, rich Scale and Color capabilities.

All graphics render on the client by using the Scalable Vector Graphics (SVG) format.

Kendo UI for jQuery Kendoka image

The CircularGauge is part of Kendo UI for jQuery, a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

Initializing the CircularGauge

To create the CircularGauge, use a div element and, optionally, set a height and width by using CSS.

<div id="circular-gauge"></div>

The following example demonstrates how to initialize the CircularGauge with its default configuration.

$(document).ready(function() {
    $("#circular-gauge").kendoCircularGauge();
});

Functionality and Features

See Also

In this article
Not finding the help you need? Improve this article