Home / Community & Support / Developer Productivity Tools Forums / Silverlight > Gauge > radialgauge custom tick marks

• andrea

  Posted on Oct 13, 2011 (permalink)

  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.
  

  Reply

• Andrey Andrey

  Posted on Oct 17, 2011 (permalink)

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

  Reply

• andrea

  Posted on Oct 17, 2011 (permalink)

  Thank you very much.
  Andrea

  Reply

• andrea

  Posted on Oct 19, 2011 (permalink)

  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.
  
  

  
  

  Reply

• Andrey Andrey

  Posted on Oct 24, 2011 (permalink)

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

  Reply

• andrea

  Posted on Oct 24, 2011 (permalink)

  Ok, thank you very much.
  
  Andrea
  

  Reply

• Umapathi

  Posted on Nov 8, 2011 (permalink)

  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

  Reply

• Andrey Andrey

  Posted on Nov 10, 2011 (permalink)

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

  Reply

• Umapathi

  Posted on Nov 11, 2011 (permalink)

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

  Reply

• Andrey Andrey

  Posted on Nov 15, 2011 (permalink)

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

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / Silverlight > Gauge > radialgauge custom tick marks