This is a migrated thread and some comments may be shown as answers.

radialgauge custom tick marks

9 Answers 109 Views
Gauge
This is a migrated thread and some comments may be shown as answers.
andrea
Top achievements
Rank 1
andrea asked on 13 Oct 2011, 10:57 AM
Hi,
I have a radial gauge with 
Min="10" Max="35" MajorTicks="3" MiddleTicks="2" Multiplier="0.1">

I need to show custom marks with number label at positions 10, 20, 30, 35 and labels should display 1,2,3,3.5

How to do this?
Thank you very much.

9 Answers, 1 is accepted

Sort by
0
Andrey
Telerik team
answered on 17 Oct 2011, 12:36 PM
Hello Andrea,

You can use the RadialScale.MajorTickStep property and appropriate format for labels. For more information please take a look into the following documentation topics:
http://www.telerik.com/help/silverlight/radgauge-features-labels-format.html
http://www.telerik.com/help/silverlight/radial-scale-tick-marks.html

The sample code is below.
<telerik:RadGauge Width="300" Height="300">
    <telerik:RadialGauge>
        <telerik:RadialScale Min="10" Max="35" MajorTickStep="10" MiddleTicks="2" Multiplier="0.1">
            <telerik:RadialScale.Label>
                <telerik:LabelProperties Format="{}{0:D1}"/>
            </telerik:RadialScale.Label>
        </telerik:RadialScale>
    </telerik:RadialGauge>
</telerik:RadGauge>

You can also use the CustomTickMark.Format property the same way if you use the CustomTickMark control in additional to regular tick marks.

Regards,
Andrey Murzov
the Telerik team

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

0
andrea
Top achievements
Rank 1
answered on 17 Oct 2011, 01:15 PM
Thank you very much.
Andrea
0
andrea
Top achievements
Rank 1
answered on 19 Oct 2011, 10:47 PM
Hi,
I have a strange behaviour when i publish my silverlight application.
I use the free gauge control.
In the same project i have telerick reporting in evalutation.

When i browse the application, on page with gauge control appear the messagge "Telerick rad controls for silverlight trial".
So i check reference and the i have for assembly:
telerik.windows.controls

telerik.windows.controls.gauge

telerik.windows.controls.navigation
referenced the trial version 2011.2.712.1040 so i change all this references with free dll's version 2010.2.924.1040.

The message "trial" isn't showed and the gauge work fine, but when i navigate to other page with reportviewer control (5.1.11.928) i have an exception:
System.Windows.Markup.XamlParseException occurred
  Message=L'operazione per impostare la proprietà 'System.Windows.FrameworkElement.Style' ha generato un'eccezione. [Line: 79 Position: 119]
  LineNumber=79
  LinePosition=119
  StackTrace:
       su System.Windows.Application.LoadComponent(Object component, Uri resourceLocator)
       su PSIng.PageListaDdtLotto.InitializeComponent()
       su PSIng.PageListaDdtLotto..ctor()
  InnerException: System.Windows.Markup.XamlParseException
       Message=Tipo 'RadComboBox' non trovato poiché 'clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input' è uno spazio dei nomi sconosciuto. [Line: 8 Position: 36]
       LineNumber=8
       LinePosition=36
       StackTrace:
            su MS.Internal.XcpImports.CreateFromXaml(UnmanagedMemoryStream stream, String sourceAssemblyName, Boolean createNamescope, Boolean requireDefaultNamespace, Boolean allowEventHandlers)
            su System.Windows.Controls.Control.GetBuiltInStyle(IntPtr nativeTarget, IntPtr& nativeStyle)
       InnerException:

I translate in english:
Type 'RadComboBox' not found because 'clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input' is an unknow namespace

There are compatibility problem using reporting 2011 q2 and free gauge control 2010.q2

Do you have update to 2011 q2 for free silverlight gauge control?

Thank you very much.


0
Andrey
Telerik team
answered on 24 Oct 2011, 08:37 AM
Hello Andrea,

You can't mix up DLLs from different versions of pur products in 1 project. Most probably the update for free silverlight gauge control will happen after our official Q3 2011 release.

All the best,
Andrey Murzov
the Telerik team

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

0
andrea
Top achievements
Rank 1
answered on 24 Oct 2011, 09:07 AM
Ok, thank you very much.

Andrea
0
Umapathi
Top achievements
Rank 1
answered on 08 Nov 2011, 01:01 PM
Hi everybody.,
 i am facing a strange issue..that is we are using radial gauge,in that we have used custom tick mark.when we are using the binding property in that.we are unable to view the gauges in design time..(i.e- in xaml).but its working fine with all datas..even we are getting all datas in our application..only problem is we are Not able to view the gauges in design time..Can any one resolve it..?
   here is my xaml...
<UserControl x:Class="Splendid.Koc.StatusMap.Views.GL.GLGaugeView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:control="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Gauge"
        xmlns:gauge="clr-namespace:Telerik.Windows.Controls.Gauges;assembly=Telerik.Windows.Controls.Gauge"
        xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
        xmlns:Splendid_Common_Behaviors="clr-namespace:Splendid.Common.Behaviors;assembly=Splendid.Common"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:controlsToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
        xmlns:ec="http://schemas.microsoft.com/expression/2010/controls"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d" Width="900" Height="200"
        DataContext="{Binding GLGaugeViewModel, Source={StaticResource ServiceLocator}}">
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary x:Name="ResourceDic"
                        Source="/Telerik.Windows.Controls.Gauge;component/Themes/Generic.xaml" />
            </ResourceDictionary.MergedDictionaries>
            <ControlTemplate x:Key="RadGaugeControlTemplate1"
                    TargetType="telerik:RadGauge" />
            <ControlTemplate x:Key="NeedleControlTemplate1"
                    TargetType="telerik:Needle" />
            <ControlTemplate x:Key="NeedleControlTemplate2"
                    TargetType="telerik:Needle" />
            <ControlTemplate x:Key="RadialRangeControlTemplate1"
                    TargetType="telerik:RadialRange" />
        </ResourceDictionary>
    </UserControl.Resources>
    <controlsToolkit:BusyIndicator x:Name="GLGaugeBusyIndicator"
IsBusy="{Binding IsLoading}" DisplayAfter="0">
        <Grid x:Name="LayoutRoot" Width="900"
                HorizontalAlignment="Center" VerticalAlignment="Bottom">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <StackPanel Margin="72,63,76,40" Grid.Row="1"
                    Orientation="Horizontal">
                <Path
                        Data="F1M84.1304,229.0811C84.1304,177.0551,126.3064,134.8781,178.3334,134.8781C230.3594,134.8781,272.5364,177.0551,272.5364,229.0811"
                        Stretch="Fill" Margin="0,15,-0.23,0"
                        UseLayoutRounding="False" Height="40"
                        VerticalAlignment="Center" Width="79"
                        HorizontalAlignment="Left">
                    <Path.Fill>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FF0A0A0B" Offset="0" />
                            <GradientStop Color="#FF39353B" Offset="1" />
                        </LinearGradientBrush>
                    </Path.Fill>
                </Path>
                <Path
                        Data="F1M84.1304,229.0811C84.1304,177.0551,126.3064,134.8781,178.3334,134.8781C230.3594,134.8781,272.5364,177.0551,272.5364,229.0811"
                        Stretch="Fill" Margin="145,15,0,0"
                        UseLayoutRounding="False" Height="40"
                        VerticalAlignment="Center" Width="79"
                        HorizontalAlignment="Left">
                    <Path.Fill>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FF0A0A0B" Offset="0" />
                            <GradientStop Color="#FF39353B" Offset="1" />
                        </LinearGradientBrush>
                    </Path.Fill>
                </Path>
                <Path
                        Data="F1M84.1304,229.0811C84.1304,177.0551,126.3064,134.8781,178.3334,134.8781C230.3594,134.8781,272.5364,177.0551,272.5364,229.0811"
                        Stretch="Fill" Margin="143,15,0,0"
                        UseLayoutRounding="False" Height="40"
                        VerticalAlignment="Center" Width="79"
                        HorizontalAlignment="Left" IsHitTestVisible="True">
                    <Path.Fill>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FF0A0A0B" Offset="0" />
                            <GradientStop Color="#FF39353B" Offset="1" />
                        </LinearGradientBrush>
                    </Path.Fill>
                </Path>
                <Path
                        Data="F1M84.1304,229.0811C84.1304,177.0551,126.3064,134.8781,178.3334,134.8781C230.3594,134.8781,272.5364,177.0551,272.5364,229.0811"
                        Stretch="Fill" Margin="143,15,0,0"
                        UseLayoutRounding="False" Height="40"
                        VerticalAlignment="Center" Width="79"
                        HorizontalAlignment="Left">
                    <Path.Fill>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FF0A0A0B" Offset="0" />
                            <GradientStop Color="#FF39353B" Offset="1" />
                        </LinearGradientBrush>
                    </Path.Fill>
                </Path>
            </StackPanel>
            <StackPanel x:Name="stkSelectedWellName" Width="Auto"
                    Grid.Row="0">
                <TextBlock Text="{Binding GaugeWellName}"
                        VerticalAlignment="Center" Style="{StaticResource GauageText}"
                        HorizontalAlignment="Center" Visibility="{Binding GaugeHeaderVisibility}"  />
            </StackPanel>

            <Border x:Name="bdrGauges" VerticalAlignment="Bottom"
                    Grid.RowSpan="3" Grid.Row="1" Margin="0">
                <Grid VerticalAlignment="Bottom">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Border Grid.Row="0" Grid.Column="0">
                        <StackPanel>
                            <TextBlock Margin="0" TextWrapping="Wrap"
                                    VerticalAlignment="Top" Style="{StaticResource GauageNumber}"
                                    Text="{Binding FirstGauge.FirstNeedleValue}"
                                    HorizontalAlignment="Center">
                            </TextBlock>
                        </StackPanel>
                    </Border>
                    <Grid Grid.Column="0" Grid.Row="1">
                        <Border BorderBrush="{Binding NominalGaugeColor}"
                                BorderThickness="1" Margin="10,10,10,15">
                            <telerik:RadGauge x:Name="rdgLiquidRate"
                                    Width="200" Height="100"
                                    Tag="Nominal Pressure" >
                                <telerik:RadialGauge
                                        Style="{StaticResource RadialGaugeHalfCircleNStyle}"
                                        Background="{x:Null}"
                                        BorderBrush="{x:Null}"
                                        OuterBackground="{x:Null}"
                                        OuterBorderBrush="{x:Null}"
                                        x:Name="RadialGauge1">
                                    <telerik:TickList >
                                        <telerik:CustomTickMark x:Name="QLiqTick0" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="0" Value="0"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark x:Name="QLiqTick1" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FirstGauge.LowLow}" Value="{Binding FirstGauge.LowLow}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark x:Name="QLiqTick2" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FirstGauge.Low}" Value="{Binding FirstGauge.Low}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark x:Name="QLiqTick3" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FirstGauge.High}" Value="{Binding FirstGauge.High}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark x:Name="QLiqTick4" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FirstGauge.HighHigh}" Value="{Binding FirstGauge.HighHigh}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark x:Name="QLiqTick5" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FirstGauge.Max}" Value="{Binding FirstGauge.Max}"></telerik:CustomTickMark>
                                    </telerik:TickList>
                                    <telerik:RadialScale
                                            Style="{StaticResource RadialScaleHalfCircleNStyle}"
                                            Min="0" Max="{Binding FirstGauge.Max}"
                                            LabelRotationMode="None"
                                            MajorTickStep="{Binding FirstGauge.MajorTickStep}"
                                            FontWeight="SemiBold"
                                            x:Name="QLiqRadScale">
                                        <telerik:RadialScale.Label>
                                            <telerik:LabelProperties Foreground="Transparent"
                                                    Format="{Binding FirstGauge.LableFormat}"
                                                    Location="CenterOutside" />
                                        </telerik:RadialScale.Label>
                                        <telerik:RadialScale.MajorTick>
                                            <telerik:MajorTickProperties Length="0.25" Location="Outside" Background="#FFBABABA" Offset="0.17" />
                                        </telerik:RadialScale.MajorTick>
                                        <telerik:RadialScale.MinorTick>
                                            <telerik:MinorTickProperties Length="0.10" Location="Outside" Background="#FFBABABA" Offset="0.32"/>
                                        </telerik:RadialScale.MinorTick>
                                        <telerik:RadialScale.MiddleTick>
                                            <telerik:MiddleTickProperties Length="0.10" Location="Outside" Background="#FFBABABA" Offset="0.32"/>
                                        </telerik:RadialScale.MiddleTick>
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QLiqRadialRange1"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#8b250e" Max="{Binding FirstGauge.LowLow}"
                                                        Min="0"  />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QLiqRadialRange2"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#9f8821" Max="{Binding FirstGauge.Low}"
                                                        Min="{Binding FirstGauge.LowLow}" />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QLiqRadialRange3"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#64851e" Max="{Binding FirstGauge.High}"
                                                        Min="{Binding FirstGauge.Low}" />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QLiqRadialRange4"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#9f8821" Max="{Binding FirstGauge.HighHigh}"
                                                        Min="{Binding FirstGauge.High}"  />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QLiqRadialRange5"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#8b250e" Max="{Binding FirstGauge.Max}"
                                                        Min="{Binding FirstGauge.HighHigh}"  />
                                        <telerik:IndicatorList>
                                            <telerik:Needle
                                                    x:Name="gauge1_needle2"
                                                    Value="{Binding FirstGauge.FirstNeedleValue}"
                                                    IsAnimated="true"
                                                    ArrowBackground="Black"
                                                    ArrowBorderBrush="Black"
                                                    Height="13"
                                                    Background="{x:Null}"
                                                    BorderBrush="{x:Null}">
                                                <telerik:Needle.Effect>
                                                    <DropShadowEffect
                                                            BlurRadius="4"
                                                            ShadowDepth="2"
                                                            Opacity="0.75" />
                                                </telerik:Needle.Effect>
                                            </telerik:Needle>
                                        </telerik:IndicatorList>
                                    </telerik:RadialScale>
                                </telerik:RadialGauge>
                            </telerik:RadGauge>
                        </Border>
                        <StackPanel Margin="0" VerticalAlignment="Bottom">
                            <TextBlock Margin="0" TextWrapping="Wrap"
                                    VerticalAlignment="Top" FontSize="13"
                                    Foreground="White"
                                    HorizontalAlignment="Center" Text="{Binding FirstGaugeUnit}"></TextBlock>
                            <TextBlock Margin="0,5,0,-5" TextWrapping="Wrap"
                                    VerticalAlignment="Top" Style="{StaticResource GauageText}"
                                    HorizontalAlignment="Center" Text="{Binding FirstGaugeHeader}"></TextBlock>
                        </StackPanel>
                    </Grid>
                    <Border Grid.Row="0" Grid.Column="1">
                        <StackPanel>
                            <TextBlock Margin="0" TextWrapping="Wrap"
                                    VerticalAlignment="Top"  Style="{StaticResource GauageNumber}"
                                    Text="{Binding SecondGauge.FirstNeedleValue}"
                                    HorizontalAlignment="Center">
                            </TextBlock>
                        </StackPanel>
                    </Border>
                    <Grid Grid.Column="1" Grid.Row="1">
                        <Border BorderBrush="{Binding VoidageGaugeColor}"
                                BorderThickness="1" Margin="10,10,10,15">
                            <telerik:RadGauge Grid.Row="3" Width="200"
                                    Height="100" Tag="Voidage Replacement"
                                    x:Name="rdgVoidageReplacement">
                                <telerik:RadGauge x:Name="RadialGauge2"
                                        Width="200" Height="100"
                                        Tag="Nominal Pressure" >
                                    <telerik:RadialGauge
                                            Style="{StaticResource RadialGaugeHalfCircleNStyle}"
                                            Background="{x:Null}"
                                            BorderBrush="{x:Null}"
                                            OuterBackground="{x:Null}"
                                            OuterBorderBrush="{x:Null}"
                                            x:Name="RadialGauge1VR">
                                        <telerik:TickList x:Name="QoilTickList" Canvas.ZIndex="1">
                                            <telerik:CustomTickMark x:Name="QoilTick0" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="0" Value="0"></telerik:CustomTickMark>
                                            <telerik:CustomTickMark x:Name="QoilTick1" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding SecondGauge.LowLow}" Value="{Binding SecondGauge.LowLow}"></telerik:CustomTickMark>
                                            <telerik:CustomTickMark x:Name="QoilTick2" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding SecondGauge.Low}" Value="{Binding SecondGauge.Low}"></telerik:CustomTickMark>
                                            <telerik:CustomTickMark x:Name="QoilTick3" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding SecondGauge.High}" Value="{Binding SecondGauge.High}"></telerik:CustomTickMark>
                                            <telerik:CustomTickMark x:Name="QoilTick4" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding SecondGauge.HighHigh}" Value="{Binding SecondGauge.HighHigh}"></telerik:CustomTickMark>
                                            <telerik:CustomTickMark x:Name="QoilTick5" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding SecondGauge.Max}" Value="{Binding SecondGauge.Max}"></telerik:CustomTickMark>
                                        </telerik:TickList>
                                        <telerik:RadialScale x:Name="QoilRadScale"
                                                Style="{StaticResource RadialScaleHalfCircleNStyle}"
                                                Min="0" Max="{Binding SecondGauge.Max}"
                                                MajorTickStep="{Binding SecondGauge.MajorTickStep}"
                                                LabelRotationMode="None"
                                                FontWeight="SemiBold">
                                            <telerik:RadialScale.Label>
                                                <telerik:LabelProperties Foreground="Transparent"
                                                        Format="{Binding SecondGauge.LableFormat}"
                                                        Location="CenterOutside"  />
                                            </telerik:RadialScale.Label>
                                            <telerik:RadialScale.MajorTick>
                                                <telerik:MajorTickProperties Length="0.25" Location="Outside" Background="#FFBABABA" Offset="0.17" />
                                            </telerik:RadialScale.MajorTick>
                                            <telerik:RadialScale.MinorTick>
                                                <telerik:MinorTickProperties Length="0.10" Location="Outside" Background="#FFBABABA" Offset="0.32"/>
                                            </telerik:RadialScale.MinorTick>
                                            <telerik:RadialScale.MiddleTick>
                                                <telerik:MiddleTickProperties Length="0.10" Location="Outside" Background="#FFBABABA" Offset="0.32"/>
                                            </telerik:RadialScale.MiddleTick>
                                            <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QOilRadialRange1"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#8b250e" Max="{Binding SecondGauge.LowLow}"
                                                        Min="0"  />
                                            <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QOilRadialRange2"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#9f8821" Max="{Binding SecondGauge.Low}"
                                                        Min="{Binding SecondGauge.LowLow}" />
                                            <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QOilRadialRange3"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#64851e" Max="{Binding SecondGauge.High}"
                                                        Min="{Binding SecondGauge.Low}" />
                                            <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QOilRadialRange4"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#9f8821" Max="{Binding SecondGauge.HighHigh}"
                                                        Min="{Binding SecondGauge.High}"  />
                                            <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="QOilRadialRange5"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#8b250e" Max="{Binding SecondGauge.Max}"
                                                        Min="{Binding SecondGauge.HighHigh}"  />
                                            <telerik:IndicatorList>
                                                <telerik:Needle
                                                        x:Name="gauge1_needle1"
                                                        Value="{Binding SecondGauge.FirstNeedleValue}"
                                                        ArrowBackground="Black"
                                                        ArrowBorderBrush="Black"
                                                        IsAnimated="True"
                                                        Height="13"
                                                        Background="{x:Null}"
                                                        BorderBrush="{x:Null}"
                                                        HorizontalAlignment="Stretch">
                                                    <telerik:Needle.Effect>
                                                        <DropShadowEffect
                                                                BlurRadius="4"
                                                                ShadowDepth="2"
                                                                Opacity="0.75" />
                                                    </telerik:Needle.Effect>
                                                </telerik:Needle>
                                            </telerik:IndicatorList>
                                        </telerik:RadialScale>
                                    </telerik:RadialGauge>
                                </telerik:RadGauge>
                            </telerik:RadGauge>
                        </Border>
                        <StackPanel Margin="0" VerticalAlignment="Bottom">
                            <TextBlock Margin="0" TextWrapping="Wrap"
                                    VerticalAlignment="Top" FontSize="13"
                                    Foreground="White"
                                    HorizontalAlignment="Center"><Run
                                    Text="{Binding SecondGaugeUnit}" /></TextBlock>

                            <TextBlock Margin="0,5,0,-5" TextWrapping="Wrap"
                                    VerticalAlignment="Top" Style="{StaticResource GauageText}"
                                    HorizontalAlignment="Center"><Run
                                        Text="{Binding SecondGaugeHeader}" /></TextBlock>
                        </StackPanel>
                    </Grid>
                    <Border Grid.Row="0" Grid.Column="2">
                        <StackPanel>
                            <TextBlock Margin="0" TextWrapping="Wrap"
                                    VerticalAlignment="Top" Style="{StaticResource GauageNumber}"
                                    Text="{Binding ThirdGauge.FirstNeedleValue}"
                                    HorizontalAlignment="Center">
                            </TextBlock>
                        </StackPanel>
                    </Border>
                    <Grid Grid.Column="2" Grid.Row="1">
                        <Border BorderBrush="{Binding VolumetricGaugeColor}"
                                BorderThickness="1" Margin="10">
                            <telerik:RadGauge x:Name="rdgVolumetricEfficiency"
                                    Width="200" Height="100"
                                    Tag="Volumetric Efficiency" >
                                <telerik:RadialGauge
                                        Style="{StaticResource RadialGaugeHalfCircleNStyle}"
                                        Background="{x:Null}"
                                        BorderBrush="{x:Null}"
                                        OuterBackground="{x:Null}"
                                        OuterBorderBrush="{x:Null}">
                                    <telerik:TickList x:Name="WCTickList" Canvas.ZIndex="1">
                                        <telerik:CustomTickMark Name="WCTick0" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="0" Value="0"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="WCTick1" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding ThirdGauge.LowLow}" Value="{Binding ThirdGauge.LowLow}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="WCTick2" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding ThirdGauge.Low}" Value="{Binding ThirdGauge.Low}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="WCTick3" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding ThirdGauge.High}" Value="{Binding ThirdGauge.High}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="WCTick4" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding ThirdGauge.HighHigh}" Value="{Binding ThirdGauge.HighHigh}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="WCTick5" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding ThirdGauge.Max}" Value="{Binding ThirdGauge.Max}"></telerik:CustomTickMark>
                                    </telerik:TickList>
                                    <telerik:RadialScale
                                            Style="{StaticResource RadialScaleHalfCircleNStyle}"
                                            LabelRotationMode="None"
                                            FontWeight="SemiBold"
                                            MajorTickStep="{Binding ThirdGauge.MajorTickStep}" Min="0" Max="{Binding ThirdGauge.Max}"
                                            x:Name="WaterCutRadScale">
                                        <telerik:RadialScale.Label>
                                            <telerik:LabelProperties Foreground="Transparent"
                                                Format="{Binding ThirdGauge.LableFormat}"
                                                    Location="CenterOutside" />
                                        </telerik:RadialScale.Label>
                                        <telerik:RadialScale.MajorTick>
                                            <telerik:MajorTickProperties Length="0.25" Location="Outside" Background="#FFBABABA" Offset="0.17" />
                                        </telerik:RadialScale.MajorTick>
                                        <telerik:RadialScale.MinorTick>
                                            <telerik:MinorTickProperties Length="0.10" Location="Outside" Background="#FFBABABA" Offset="0.32"/>
                                        </telerik:RadialScale.MinorTick>
                                        <telerik:RadialScale.MiddleTick>
                                            <telerik:MiddleTickProperties Length="0.10" Location="Outside" Background="#FFBABABA" Offset="0.32"/>
                                        </telerik:RadialScale.MiddleTick>
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="WCRadialRange1"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#8b250e" Max="{Binding ThirdGauge.LowLow}"
                                                        Min="0"  />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="WCRadialRange2"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#9f8821" Max="{Binding ThirdGauge.Low}"
                                                        Min="{Binding ThirdGauge.LowLow}" />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="WCRadialRange3"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#64851e" Max="{Binding ThirdGauge.High}"
                                                        Min="{Binding ThirdGauge.Low}" />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="WCRadialRange4"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#9f8821" Max="{Binding ThirdGauge.HighHigh}"
                                                        Min="{Binding ThirdGauge.High}"  />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="WCRadialRange5"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#8b250e" Max="{Binding ThirdGauge.Max}"
                                                        Min="{Binding ThirdGauge.HighHigh}"  />
                                        <telerik:IndicatorList>
                                            <telerik:Needle
                                                    x:Name="gauge1_needle3"
                                                    Value="{Binding ThirdGauge.FirstNeedleValue}"
                                                    IsAnimated="true"
                                                    ArrowBackground="Black"
                                                    ArrowBorderBrush="Black"
                                                    Height="13"
                                                    Background="{x:Null}"
                                                    BorderBrush="{x:Null}">
                                                <telerik:Needle.Effect>
                                                    <DropShadowEffect
                                                            BlurRadius="4"
                                                            Opacity="0.75"
                                                            ShadowDepth="2" />
                                                </telerik:Needle.Effect>
                                            </telerik:Needle>
                                        </telerik:IndicatorList>
                                    </telerik:RadialScale>
                                </telerik:RadialGauge>
                            </telerik:RadGauge>
                        </Border>
                        <StackPanel Margin="0" VerticalAlignment="Bottom">
                            <TextBlock Margin="0" TextWrapping="Wrap"
                                    VerticalAlignment="Top" FontSize="13"
                                    Foreground="White"
                                    HorizontalAlignment="Center"><Run Text="{Binding ThirdGaugeUnit}" /></TextBlock>
                            <TextBlock Margin="0,5,0,-5" TextWrapping="Wrap"
                                    VerticalAlignment="Top" Style="{StaticResource GauageText}"
                                    HorizontalAlignment="Center"><Run
                                        Text="{Binding ThirdGaugeHeader}" /></TextBlock>
                        </StackPanel>
                    </Grid>
                    <Border Grid.Row="0" Grid.Column="3">
                        <StackPanel Orientation="Vertical">
                            <TextBlock Margin="0" TextWrapping="Wrap"
                                    VerticalAlignment="Top" Style="{StaticResource GauageNumber}"
                                    Text="{Binding FourthGauge.FirstNeedleValue}"
                                    HorizontalAlignment="Center">
                            </TextBlock>
                        </StackPanel>
                    </Border>
                    <Grid Grid.Column="3" Grid.Row="1">
                        <Border BorderBrush="{Binding DisplacementGaugeColor}"
                                BorderThickness="1" Margin="10">
                            <telerik:RadGauge x:Name="rdgDisplacement"
                                    Width="200" Height="100"
                                    Tag="Displacement Efficiency">
                                <telerik:RadialGauge
                                        Style="{StaticResource RadialGaugeHalfCircleNStyle}"
                                        Background="{x:Null}"
                                        BorderBrush="{x:Null}"
                                        OuterBackground="{x:Null}"
                                        OuterBorderBrush="{x:Null}"
                                        x:Name="RadialGauge4">
                                    <telerik:TickList x:Name="GORTickList" Canvas.ZIndex="1">
                                        <telerik:CustomTickMark Name="GORTick0" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="0" Value="0"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="GORTick1" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FourthGauge.LowLow}" Value="{Binding FourthGauge.LowLow}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="GORTick2" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FourthGauge.Low}" Value="{Binding FourthGauge.Low}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="GORTick3" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FourthGauge.High}" Value="{Binding FourthGauge.High}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="GORTick4" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FourthGauge.HighHigh}" Value="{Binding FourthGauge.HighHigh}"></telerik:CustomTickMark>
                                        <telerik:CustomTickMark Name="GORTick5" Background="Transparent" BorderBrush="Transparent" Location="CenterOutside" TooltipFormat="{Binding FourthGauge.Max}" Value="{Binding FourthGauge.Max}"></telerik:CustomTickMark>
                                    </telerik:TickList>                                    
                                    <telerik:RadialScale
                                            Style="{StaticResource RadialScaleHalfCircleNStyle}"
                                            LabelRotationMode="None"
                                            FontWeight="SemiBold"
                                            Max="{Binding FourthGauge.Max}" Min="0" MajorTickStep="{Binding FourthGauge.MajorTickStep}"
                                            x:Name="GORRadScale">
                                        <telerik:RadialScale.Label>
                                            <telerik:LabelProperties Foreground="Transparent"
                                                    Format="{Binding FourthGauge.LableFormat}"
                                                    Location="CenterOutside" />
                                        </telerik:RadialScale.Label>
                                        <telerik:RadialScale.MajorTick>
                                            <telerik:MajorTickProperties Length="0.25" Location="Outside" Background="#FFBABABA" Offset="0.17" />
                                        </telerik:RadialScale.MajorTick>
                                        <telerik:RadialScale.MinorTick>
                                            <telerik:MinorTickProperties Length="0.10" Location="Outside" Background="#FFBABABA" Offset="0.32"/>
                                        </telerik:RadialScale.MinorTick>
                                        <telerik:RadialScale.MiddleTick>
                                            <telerik:MiddleTickProperties Length="0.10" Location="Outside" Background="#FFBABABA" Offset="0.32"/>
                                        </telerik:RadialScale.MiddleTick>
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="GORRange1"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#8b250e" Max="{Binding FourthGauge.LowLow}"
                                                        Min="0"  />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="GORRange2"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#9f8821" Max="{Binding FourthGauge.Low}"
                                                        Min="{Binding FourthGauge.LowLow}" />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="GORRange3"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#64851e" Max="{Binding FourthGauge.High}"
                                                        Min="{Binding FourthGauge.Low}" />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="GORRange4"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#9f8821" Max="{Binding FourthGauge.HighHigh}"
                                                        Min="{Binding FourthGauge.High}"  />
                                        <telerik:RadialRange Canvas.ZIndex="-1"
                                                        x:Name="GORRange5"
                                                        StartWidth="1"
                                                        EndWidth="1"
                                                        Location="OverCenter"
                                                        Background="#8b250e" Max="{Binding FourthGauge.Max}"
                                                        Min="{Binding FourthGauge.HighHigh}"  />
                                        <telerik:IndicatorList>
                                            <telerik:Needle
                                                    x:Name="gauge1_needle4"
                                                    Value="{Binding FourthGauge.FirstNeedleValue}"
                                                    IsAnimated="true"
                                                    ArrowBackground="Black"
                                                    ArrowBorderBrush="Black"
                                                    Height="13"
                                                    Background="{x:Null}"
                                                    BorderBrush="{x:Null}">
                                                <telerik:Needle.Effect>
                                                    <DropShadowEffect
                                                            BlurRadius="4"
                                                            ShadowDepth="2"
                                                            Opacity="0.75" />
                                                </telerik:Needle.Effect>
                                            </telerik:Needle>
                                        </telerik:IndicatorList>
                                    </telerik:RadialScale>
                                </telerik:RadialGauge>
                            </telerik:RadGauge>
                        </Border>
                        <StackPanel Orientation="Vertical" Margin="0,81,0,0">
                            <TextBlock Margin="0" TextWrapping="Wrap"
                                    VerticalAlignment="Top" FontSize="13"
                                    Foreground="White"
                                    HorizontalAlignment="Center" Text="{Binding FourthGaugeUnit}"></TextBlock>
                            <TextBlock Margin="0,5,0,-5" TextWrapping="Wrap"
                                    VerticalAlignment="Top" Style="{StaticResource GauageText}"
                                    HorizontalAlignment="Center" Text="{Binding FourthGaugeHeader}"></TextBlock>
                        </StackPanel>
                    </Grid>
                </Grid>
            </Border>
        </Grid>
    </controlsToolkit:BusyIndicator>
</UserControl>

thanks
Umapathi.A
0
Andrey
Telerik team
answered on 10 Nov 2011, 04:51 PM
Hello Umapathi,

Unfortunately there is a problem in design time with the data binding of the CustomTickMark.Value property in a XAML code. As workaround you can specify some value in XAML code and you can create the data binding within the codebehind of UserControl like the following:
Binding binding = new Binding("LowLow");
binding.Source = viewModel;
this.QLiqTick1.SetBinding(CustomTickMark.ValueProperty, binding);

Also I should note that the RadialRange elements of your XAML shouldn't be included into the RadialScale element directly. They should be placed inside the RangeList like the indicators in the IndicatorList.

Best wishes,
Andrey Murzov
the Telerik team

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

0
Umapathi
Top achievements
Rank 1
answered on 11 Nov 2011, 06:08 AM
Hi Andrey....
           Thank You for your reply...this is nice.we hav done it already in code behind...Could you give us a detail in XAML..not in code behind..we are in positiion to bind the datas using only on  XAML...at the same time.design view should be clear ...Looking for positive reply...

0
Andrey
Telerik team
answered on 15 Nov 2011, 02:21 PM
Hello Umapathi,

Unfortunately it can't be done in a XAML code, because you will get an exception in design time with the data binding of the CustomTickMark.Value property. At this moment we have redesigned the gauge control completely. New version will be available in the 2011.Q3 release. Current version of gauge control will be also available, but it will not contain a fix of this issue.

Kind regards,
Andrey Murzov
the Telerik team

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

Tags
Gauge
Asked by
andrea
Top achievements
Rank 1
Answers by
Andrey
Telerik team
andrea
Top achievements
Rank 1
Umapathi
Top achievements
Rank 1
Share this question
or