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

Set dates as labels for gauge control

1 Answer 26 Views
Gauge
This is a migrated thread and some comments may be shown as answers.
Marko
Top achievements
Rank 1
Marko asked on 14 Apr 2011, 08:31 AM
Hi,

Is it possible to setup dates as minimum and maximum values for gauge control (with dates between as major ticks)?

Best regards,
Marko

1 Answer, 1 is accepted

Sort by
0
Andrey
Telerik team
answered on 18 Apr 2011, 05:39 PM
Hello Marko,

You can use custom tick marks to show date as label of tick.
The sample code is below.
<UserControl x:Class="CustomTicks.MainPage"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <UserControl.Resources>
        <DataTemplate x:Key="TickLabelAppearance">
            <TextBlock HorizontalAlignment="Center"
                   FontFamily="{Binding Path=Properties.FontFamily}"
                   FontSize="{Binding Path=Properties.FontSize}"
                   Foreground="{Binding Path=Properties.Foreground}"
                   Margin="4,2,4,2">
            <TextBlock.Text>
                <Binding>
                    <Binding.Converter>
                        <telerik:LabelFormatConverter />
                    </Binding.Converter>
                </Binding>
            </TextBlock.Text>
            </TextBlock>
        </DataTemplate>
  
        <Style x:Key="TickMarkStyle" TargetType="telerik:CustomTickMark">
            <Setter Property="Length" Value="0.075" />
            <Setter Property="TickWidth" Value="0.2" />
            <Setter Property="FontSize" Value="14" />
            <Setter Property="Foreground" Value="White" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Grid />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="ItemTemplate" Value="{StaticResource TickLabelAppearance}" />
        </Style>
  
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot" Background="White">
  
        <telerik:RadGauge Width="200" Height="300">
            <telerik:LinearGauge>
                <telerik:LinearScale MajorTicks="4">
                    <telerik:LinearScale.Label>
                        <telerik:LabelProperties Foreground="Transparent" />
                    </telerik:LinearScale.Label>
                    <telerik:TickList>
                        <telerik:CustomTickMark Value="0"
                                                Format="4-15-11"
                                                Style="{StaticResource TickMarkStyle}">
                        </telerik:CustomTickMark>
                        <telerik:CustomTickMark Value="50"
                                                Format="4-17-11"
                                                Style="{StaticResource TickMarkStyle}">
                        </telerik:CustomTickMark>
                        <telerik:CustomTickMark Value="100"
                                                Format="4-19-11"
                                                Style="{StaticResource TickMarkStyle}">
                        </telerik:CustomTickMark>
                    </telerik:TickList>
                </telerik:LinearScale>
            </telerik:LinearGauge>
        </telerik:RadGauge>
  
    </Grid>
</UserControl>

All the best,
Andrey Murzov
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
Gauge
Asked by
Marko
Top achievements
Rank 1
Answers by
Andrey
Telerik team
Share this question
or