Dynamically change range sizes on radial gauge

2 posts, 0 answers
  1. Ian
    Ian avatar
    8 posts
    Member since:
    Mar 2013

    Posted 22 Jul 2013 Link to this post


    I currently have the following but I would like to be able to specify the ranges dynamically using sliders. Can anyone tell me how to implement this?

    Note - there will always be four ranges, its just where these start and stop is where I want to regulate.

    .Pointer(pointer => pointer
    .Scale(scale => scale
    .Labels(GaugeRadialScaleLabels => GaugeRadialScaleLabels
    .Ranges(ranges =>
  2. Iliana Nikolova
    Iliana Nikolova avatar
    2622 posts

    Posted 24 Jul 2013 Link to this post

    Hello Ian,

    Basically Kendo UI Radial Gauge does not support dynamic changes of its configuration options, however you could workaround it and set new ranges via the options (keep in mind you should redraw the Gauge). For example: 

    //get reference to the Gauge widget
    var gauge = $("#gauge").data("kendoRadialGauge");
    //get the Gauge ranges
    var ranges = gauge.options.scale.ranges;
    //set 1000 as "from" value to the second range
    ranges[1].from = 1000;
    //redraw the Gauge
    Iliana Nikolova
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top