Semicircle gauge issue after update

2 posts, 0 answers
  1. Rahil Kidwai
    Rahil Kidwai avatar
    3 posts
    Member since:
    Aug 2012

    Posted 02 Jul 2012 Link to this post

    I have a requirement to display some constant statistical data in a semicircular gauge and I am using RadSemicircleNorthGauge control.
    To achieve the desired look of the gauge the background properties of the gauge (InnerBackground, OuterBackground, OuterBorderBrush, Background) are all set to transparent. GaugeRange background property is being set appropriately to get the desired look. 
    Everything was working fine with  2012 Q1 version, but soon after updating to 2012 Q2 the semi circular gauge is no more semi circular. It's total span now is 270° instead of 180°.
    I am pasting the test code below for your reference. Can you please help and let me know how to fix the problem?
    Thanks 
    -Rahil

    <UserControl 
        x:Class="SilverlightApplication1.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:telerikgauge="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.DataVisualization">

        <Grid> 
            <telerikgauge:RadSemicircleNorthGauge MaxHeight="600" MaxWidth="600" InnerBackground="Transparent" OuterBackground="Transparent" OuterBorderBrush="Transparent" Background="Transparent">
                <telerik:RadialScale RangeLocation="Inside"  Min="0" Max="100" MajorTickStep="10" MiddleTicks="1">
                    <telerik:RadialScale.Ranges>
                        <telerik:GaugeRange Min="0" Max="40" StartWidth="0.7" EndWidth="0.7" Background="Red"/>
                        <telerik:GaugeRange Min="40" Max="100" StartWidth="0.7" EndWidth="0.7" Background="Green"/>
                    </telerik:RadialScale.Ranges>
                    <telerik:RadialScale.Indicators>
                        <telerik:Needle Value="40" TailHeight="0" Background="Blue"  BorderBrush="Blue"/>
                        <telerik:Pinpoint Background="Blue" BorderBrush="Blue" />
                    </telerik:RadialScale.Indicators>
                </telerik:RadialScale>
            </telerikgauge:RadSemicircleNorthGauge>
        </Grid>
    </UserControl>

  2. Andrey
    Admin
    Andrey avatar
    1681 posts

    Posted 05 Jul 2012 Link to this post

    Hi Rahil,

    In the 2012.Q2 release we introduced a few breaking changes in the gauge control. We’ve added separate scale type for all semicircle and quadrant-style gauges. You can find description of changes here:

    http://www.telerik.com/help/wpf/radgauge-what-is-new.html

    For example, when you create North oriented quadrant gauge it is not enough to just create right type of the gauge control, but you must use the right type of the scale inside the container. I.e. instead of RadialScale you should use SemicircleNorthScale:

    <telerik:RadSemicircleNorthGauge MaxHeight="600"
                     MaxWidth="600"
                     InnerBackground="Transparent"
                     OuterBackground="Transparent"
                     OuterBorderBrush="Transparent"
                     Background="Transparent">
        <telerik:SemicircleNorthScale RangeLocation="Inside" 
                      Min="0"
                      Max="100"
                      MajorTickStep="10"
                      MiddleTicks="1">
            <telerik:RadialScale.Ranges>
                <telerik:GaugeRange Min="0"
                    Max="40"
                    StartWidth="0.7"
                    EndWidth="0.7"
                    Background="Red"/>
                <telerik:GaugeRange Min="40"
                    Max="100"
                    StartWidth="0.7"
                    EndWidth="0.7"
                    Background="Green"/>
            </telerik:RadialScale.Ranges>
            <telerik:RadialScale.Indicators>
                <telerik:Needle Value="40"
                        TailHeight="0"
                        Background="Blue" 
                        BorderBrush="Blue"/>
                <telerik:Pinpoint Background="Blue"
                          BorderBrush="Blue" />
            </telerik:RadialScale.Indicators>
        </telerik:SemicircleNorthScale>
    </telerik:RadSemicircleNorthGauge>


    Kind regards,
    Andrey Murzov
    the Telerik team

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

  3. DevCraft banner
Back to Top