Edit this page

pointer Array

The pointer configuration options. It accepts an Array of pointers, each with it's own configuration options.

Example - specify single pointer

<div id="gauge"></div>
<script>
$("#gauge").kendoRadialGauge({
    pointer: [{
    value: 20
    }]
});
</script>

Example - specify multiple pointers

<div id="gauge"></div>
<script>
$("#gauge").kendoRadialGauge({
    pointer: [{
    value: 20
    }, {
    value: 40
    }]
});
</script>

pointer.cap Object

The cap configuration options.

pointer.cap.color String

The color of the cap. Any valid CSS color string will work here, including hex and rgb.

pointer.cap.size Number

The size of the cap in percents. (from 0 to 1)

pointer.color String

The color of the pointer. Any valid CSS color string will work here, including hex and rgb.

pointer.length Number

The pointer length (in percent) that is based on the distance to the scale. The default length of 1 indicates that the pointer exactly reaches the scale. Accepts values between 0.1 and 1.5.

Example - specify pointers with different lengths

<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>

pointer.value Number

The value of the gauge.

Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy