Multiple Pointers

Updated on Sep 8, 2026

The RadialGauge enables you to highlight multiple values by rendering multiple pointers.

You can independently customize each pointer including its current value, color, and length.

html

<div id="gauge"></div>
<script>
$("#gauge").kendoRadialGauge({
    pointer: [{
        value: 10,
        color: '#ffd246',
        length: 0.5
    }, {
        value: 20,
        color: '#28b4c8',
        length: 0.75
    }, {
        value: 30,
        color: '#78d237',

        // Default length
        // length: 1
    }]
});
</script>

See Also

• Using Multiple Pointers in the RadialGauge (Demo)
• JavaScript API Reference of the RadialGauge