GuageRange Customization

2 posts, 0 answers
  1. Chandana
    Chandana avatar
    13 posts
    Member since:
    Apr 2011

    Posted 11 Jun 2012 Link to this post


    I am trying to customize the guage as it appears in the attached image. In this, I need a way to smoothen the colors on the Guage Range from Green to lighter green and lighter red to red.

    I know I can do this on the Bar indicator but need help with doing that on the range bar. Should I use a ControlTemplate for this? If so, can you please provide an example or point me in the right direction? I also need help with the Pinpoint and Needle customization. Thank you.


    <telerik:RadRadialGauge Width="300" Height="200">
                    <telerik:RadialScale IsInteractive="True" StartAngle="180" RangeOffset="0.15" SweepAngle="180" MinorTicks="1"  MiddleTicks="5" Min="0" Max="6" MajorTickStep="3">
                            <telerik:Pinpoint />
                            <telerik:GaugeRange Min="0" Max="2.5" Background="Green" IndicatorBackground="Green" StartWidth="0.13" EndWidth="0.13"/>
                            <telerik:GaugeRange Min="2.5" Max="4" Background="#7ABD7A"  IndicatorBackground="#7ABD7A" StartWidth="0.13" EndWidth="0.13"/>
                            <telerik:GaugeRange Min="4" Max="6" Background="Red" IndicatorBackground="Red" StartWidth="0.13" EndWidth="0.13"></telerik:GaugeRange>
  2. Andrey
    Andrey avatar
    1681 posts

    Posted 14 Jun 2012 Link to this post

    Hi Chandana,

    Unfortunately Silverlight does not support PathGradient gradient type. So, it will be a problem to build the ranges like the attached screenshot.

    Andrey Murzov
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

Back to Top