All Components

You are on the site of the Kendo UI Wrappers for React suite which contains wrappers for the Kendo UI for jQuery widgets. To explore the brand-new set of Kendo UI for React components which are built from the ground up, go to the Kendo UI for React suite.

Radial Gauge Overview

The Radial Gauge represents values on a circular arc.

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

The Radial Gauge wrapper for React is a client-side wrapper for the Kendo UI Radial Gauge widget.

Basic Usage

The following example demonstrates the Radial Gauge in action.

class RadialGaugeContainer extends React.Component {
    constructor(props) {
        this.value = props.value;
        this.startAngle = props.startAngle;
        this.endAngle = props.endAngle;

    render() {
        return (
            <div className="example-wrapper">
                <div className="col-xs-12 col-sm-6 example-col">
                        pointer={{value: this.value}}
                        scale={{startAngle: this.startAngle, endAngle: this.endAngle}}
    <RadialGaugeContainer value={25} startAngle={90} endAngle={180}/>,
In this article