Format Numeric Time Values

You can format the NumericTimeSeries object’s AxisLabel and EventTitle display values by using the StringFormat property. This property accepts the standard .NET format strings for values of type Double.

This example assumes that you know how to setup your project for Infragistics XamTimeline control. The following xaml code shows you how to style the AxisLabel and EventTitle in order to provide a custom format for the display values.

In XAML:

<UserControl.Resources>
    <!-- Axis Label -->
    <Style x:Key="rscAxisFormatStyle" TargetType="ig:AxisLabel">
        <!-- Formating the numeric time axis label to display: -->
        <!-- BC for negative timeline numbers -->
        <!-- AD for postive timeline numbers -->
        <Setter Property="StringFormat" Value="{}{0:## AD;## BC;0}" />
    </Style>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" >
    <ig:XamTimeline x:Name="xamTimeline"
                     Width="1000" Height="500" Margin="15">
        <!-- Set Label Style for the Axis -->
        <ig:XamTimeline.Axis>
            <ig:NumericTimeAxis Minimum="-2800" Maximum="2200"
                                  LabelStyle="{StaticResource rscAxisFormatStyle}"
                                  AutoRange=" Unit="400"/>
        </ig:XamTimeline.Axis>
        <ig:XamTimeline.Series>
            <!-- Historic Events -->
            <ig:NumericTimeSeries Title="Historic Events" Fill="Red"
                                    Position="TopOrLeft">
                <!-- TODO: Add Numeric Time Entries -->
                <ig:NumericTimeSeries.Entries>
                    <ig:NumericTimeEntry Time="-2575" Title="Pyramid"/>
                    <ig:NumericTimeEntry Time="-600" Title="Hanging Gardens"  />
                    <ig:NumericTimeEntry Time="70" Title="Colosseum "  />
                    <ig:NumericTimeEntry Time="-432" Title="Statue of Zeus"  />
                    <ig:NumericTimeEntry Time="-550" Title="Temple of Artemis"  />
                    <ig:NumericTimeEntry Time="-350" Title="Mausoleum of Mausolus"  />
                    <ig:NumericTimeEntry Time="-280" Title="Colossus of Rhodes"  />
                    <ig:NumericTimeEntry Time="-247" Title="Lighthouse of Alexandria"  />
                    <ig:NumericTimeEntry Time="-206" Title="Great Wall of China"  />
                    <ig:NumericTimeEntry Time="1520" Title="Hagia Sophia"  />
                    <ig:NumericTimeEntry Time="1653" Title="Taj Mahal"  />
                    <ig:NumericTimeEntry Time="600" Title="Chichen Itza"/>
                    <ig:NumericTimeEntry Time="1450" Title="Machu Picchu"  />
                </ig:NumericTimeSeries.Entries>
            </ig:NumericTimeSeries>
        </ig:XamTimeline.Series>
    </ig:XamTimeline>
</Grid>

XamTimeline Format Numeric Time Values 01.png

WPF | Help Topics

Format Numeric Time Values

Related Topics