Telerik Annotations

TelerikAnnotations.xaml

<UserControl x:Class="Telerik.Windows.Examples.ChartView.Annotations.MicrosoftChart"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/ChartView;component/Annotations/Resources.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
    
    <Grid x:Name="LayoutRoot">
        <telerik:ChartDataSource x:Name="chartDataSource2" 
                                 ItemsSource="{Binding Path=Data}"
                                 SamplingUnit="Week" 
                                 SamplingUnitInterval="2"/>

        <telerik:RadCartesianChart Palette="Windows8"
                                   ClipToBounds="False"
                                   TrackBallLineStyle="{StaticResource trackBallLineStyle}"
                                   TrackBallInfoStyle="{StaticResource trackBallInfoStyle}">
            <telerik:RadCartesianChart.Behaviors>
                <telerik:ChartTrackBallBehavior ShowIntersectionPoints="True" TrackInfoUpdated="ChartTrackBallBehavior_TrackInfoUpdated" />
            </telerik:RadCartesianChart.Behaviors>
            <telerik:RadCartesianChart.HorizontalAxis>
                <telerik:DateTimeContinuousAxis x:Name="horizontalAxis"
                                                MajorStep="3"
                                                MajorStepUnit="Month"
                                                PlotMode="OnTicks"
                                                LabelTemplate="{StaticResource axisLabelTemplate}"
                                                MajorTickStyle="{StaticResource tickStyle}"
                                                LineThickness="2"
                                                LineStroke="Gray" />
            </telerik:RadCartesianChart.HorizontalAxis>
            <telerik:RadCartesianChart.VerticalAxis>
                <telerik:LinearAxis x:Name="verticalAxis"
                                    Minimum="15"
                                    Maximum="40"
                                    MajorStep="5"
                                    MajorTickStyle="{StaticResource tickStyle}"
                                    LineThickness="2"
                                    LineStroke="Gray"
                                    LabelStyle="{StaticResource axisLabelStyle}"/>
            </telerik:RadCartesianChart.VerticalAxis>
            <telerik:AreaSeries ItemsSource="{Binding ElementName=chartDataSource2}"
                                CategoryBinding="Date"
                                ValueBinding="Value"
                                StrokeThickness="2"
                                Stroke="{StaticResource StrokeAccentBrush}"
                                Fill="{StaticResource FillAccentBrush}"
                                TrackBallTemplate="{StaticResource trackBallTemplate}"
                                ClipToPlotArea="False">
                <telerik:AreaSeries.VerticalAxis>
                    <telerik:LinearAxis Minimum="15"
                                        Maximum="40"
                                        MajorStep="5"
                                        HorizontalLocation="Right"
                                        MajorTickStyle="{StaticResource tickStyle}"
                                        LineThickness="1.5"
                                        LineStroke="Gray"
                                        LabelStyle="{StaticResource axisLabelStyle}"/>
                </telerik:AreaSeries.VerticalAxis>
            </telerik:AreaSeries>
            <telerik:RadCartesianChart.Grid>
                <telerik:CartesianChartGrid MajorLinesVisibility="Y" />
            </telerik:RadCartesianChart.Grid>
            <telerik:RadCartesianChart.Annotations>
                <telerik:CartesianGridLineAnnotation DataContext="{Binding Path=SignificantEvents[0]}"
                                                     Axis="{Binding ElementName=verticalAxis}"
                                                     Value="{Binding Value}" Label="{Binding EventDescription}"
                                                     StrokeThickness="2" Stroke="#FFC6E3A0" />
                <telerik:CartesianPlotBandAnnotation DataContext="{Binding Path=SignificantEvents[1]}"
                                                     Axis="{Binding ElementName=horizontalAxis}"
                                                     From="{Binding EventStart}" To="{Binding EventEnd}"
                                                     Fill="#15000000" Stroke="Transparent" />
                <telerik:CartesianCustomAnnotation DataContext="{Binding Path=SignificantEvents[2]}"
                                                   HorizontalAxis="{Binding ElementName=horizontalAxis}" VerticalAxis="{Binding ElementName=verticalAxis}"
                                                   HorizontalValue="{Binding EventStart}" VerticalValue="{Binding Value}"
                                                   ClipToPlotArea="False" VerticalOffset="5" HorizontalAlignment="Center" VerticalAlignment="Top"
                                                   Content="{Binding Path=Value, StringFormat=\{0:F2\}}" ContentTemplate="{StaticResource annotationTemplate}" />
                <telerik:CartesianCustomAnnotation DataContext="{Binding Path=SignificantEvents[3]}"
                                                   HorizontalAxis="{Binding ElementName=horizontalAxis}" VerticalAxis="{Binding ElementName=verticalAxis}"
                                                   HorizontalValue="{Binding EventStart}" VerticalValue="{Binding Value}"
                                                   ClipToPlotArea="False" VerticalOffset="5" HorizontalAlignment="Center" VerticalAlignment="Top"
                                                   Content="{Binding Path=Value, StringFormat=\{0:F2\}}" ContentTemplate="{StaticResource annotationTemplate}" />
                <telerik:CartesianGridLineAnnotation DataContext="{Binding Path=SignificantEvents[4]}"
                                                     Axis="{Binding ElementName=horizontalAxis}"
                                                     Value="{Binding EventStart}" Label="{Binding EventDescription}"
                                                     Style="{StaticResource DashedGridLineStyle}">
                    <telerik:CartesianGridLineAnnotation.LabelDefinition>
                        <telerik:ChartAnnotationLabelDefinition Location="Right" VerticalAlignment="Top" HorizontalOffset="4" DefaultVisualStyle="{StaticResource annotationLabelStyle}">
                        </telerik:ChartAnnotationLabelDefinition>
                    </telerik:CartesianGridLineAnnotation.LabelDefinition>
                </telerik:CartesianGridLineAnnotation>
                <telerik:CartesianGridLineAnnotation DataContext="{Binding Path=SignificantEvents[5]}"
                                                     Axis="{Binding ElementName=horizontalAxis}"
                                                     Value="{Binding EventStart}" Label="{Binding EventDescription}"
                                                     Style="{StaticResource DashedGridLineStyle}">
                    <telerik:CartesianGridLineAnnotation.LabelDefinition>
                        <telerik:ChartAnnotationLabelDefinition Location="Right" VerticalAlignment="Top" DefaultVisualStyle="{StaticResource annotationLabelStyle}" HorizontalOffset="4" />
                    </telerik:CartesianGridLineAnnotation.LabelDefinition>
                </telerik:CartesianGridLineAnnotation>
                <telerik:CartesianGridLineAnnotation DataContext="{Binding Path=SignificantEvents[6]}"
                                                     Axis="{Binding ElementName=horizontalAxis}"
                                                     Value="{Binding EventStart}" Label="{Binding EventDescription}"
                                                     Style="{StaticResource DashedGridLineStyle}">
                    <telerik:CartesianGridLineAnnotation.LabelDefinition>
                        <telerik:ChartAnnotationLabelDefinition Location="Right" VerticalAlignment="Top" DefaultVisualStyle="{StaticResource annotationLabelStyle}" HorizontalOffset="4" />
                    </telerik:CartesianGridLineAnnotation.LabelDefinition>
                </telerik:CartesianGridLineAnnotation>
                <telerik:CartesianGridLineAnnotation DataContext="{Binding Path=SignificantEvents[7]}"
                                                     Axis="{Binding ElementName=horizontalAxis}"
                                                     Value="{Binding EventStart}" Label="{Binding EventDescription}"
                                                     Style="{StaticResource DashedGridLineStyle}">
                    <telerik:CartesianGridLineAnnotation.LabelDefinition>
                        <telerik:ChartAnnotationLabelDefinition Location="Right" VerticalAlignment="Top" DefaultVisualStyle="{StaticResource annotationLabelStyle}" HorizontalOffset="4" />
                    </telerik:CartesianGridLineAnnotation.LabelDefinition>
                </telerik:CartesianGridLineAnnotation>
            </telerik:RadCartesianChart.Annotations>
       </telerik:RadCartesianChart>
    </Grid>
</UserControl>