Chart Control Example - Telerik

gistfile1.xml

<UserControl x:Class="Telerik.Windows.Examples.Chart.MultipleYAxes.Example"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:example="clr-namespace:Telerik.Windows.Examples.Chart.MultipleYAxes"
    xmlns:telerikQuickStart="clr-namespace:Telerik.Windows.Controls.QuickStart;assembly=Telerik.Windows.Controls"
    xmlns:chart="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Charting"
    xmlns:charting="clr-namespace:Telerik.Windows.Controls.Charting;assembly=Telerik.Windows.Controls.Charting">

    <UserControl.Resources>
        <example:ExampleViewModel x:Key="ViewModel" />
        <SolidColorBrush x:Key="FirstColor" Color="#FF8EBC00" />
        <SolidColorBrush x:Key="SecondColor" Color="#FF25A0DA" />
        <SolidColorBrush x:Key="ThirdColor" Color="#FFFF6900" />

        <Style x:Key="AxisLineStyle" TargetType="Line">
            <Setter Property="Stroke"  Value="{StaticResource FirstColor}" />
        </Style>
        <Style x:Key="MajorTickLineStyle" TargetType="Line">
            <Setter Property="Stroke"  Value="{StaticResource FirstColor}"  />
        </Style>
        <Style x:Key="MinorTickLineStyle" TargetType="Line">
            <Setter Property="Stroke" Value="{StaticResource FirstColor}" />
        </Style>
        <Style x:Key="CustomLabel" TargetType="TextBlock">
            <Setter Property="Foreground" Value="{StaticResource FirstColor}" />
        </Style>
        <Style x:Key="AxisLineStyle2" TargetType="Line">
            <Setter Property="Stroke" Value="{StaticResource SecondColor}" />
        </Style>
        <Style x:Key="MajorTickLineStyle2" TargetType="Line">
            <Setter Property="Stroke" Value="{StaticResource SecondColor}" />
        </Style>
        <Style x:Key="MinorTickLineStyle2" TargetType="Line">
            <Setter Property="Stroke" Value="{StaticResource SecondColor}" />
        </Style>
        <Style x:Key="CustomLabel2" TargetType="TextBlock">
            <Setter Property="Foreground" Value="{StaticResource SecondColor}" />
        </Style>
        <Style x:Key="AxisLineStyle3" TargetType="Line">
            <Setter Property="Stroke" Value="{StaticResource ThirdColor}" />
        </Style>
        <Style x:Key="MajorTickLineStyle3" TargetType="Line">
            <Setter Property="Stroke" Value="{StaticResource ThirdColor}" />
        </Style>
        <Style x:Key="MinorTickLineStyle3" TargetType="Line">
            <Setter Property="Stroke" Value="{StaticResource ThirdColor}" />
        </Style>
        <Style x:Key="CustomLabel3" TargetType="TextBlock">
            <Setter Property="Foreground" Value="{StaticResource ThirdColor}" />
        </Style>

        <Style x:Key="CustomLegendItem" TargetType="charting:ChartLegendItem">
            <Setter Property="Width" Value="100" />
            <Setter Property="Template" >
                <Setter.Value>
                    <ControlTemplate TargetType="charting:ChartLegendItem">
                        <Grid x:Name="PART_MainContainer" Background="{TemplateBinding Background}"
                        HorizontalAlignment="Stretch" VerticalAlignment="Top">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>
                            <Path x:Name="PART_LegendItemMarker" 
                                  Width="16"
                                  Height="16"
                                  Margin="{TemplateBinding Margin}"
                                  StrokeThickness="{TemplateBinding MarkerStrokeThickness}"
                                  Style="{TemplateBinding ItemStyle}"
                                  Stretch="Fill"
                                  VerticalAlignment="Center">
                                <Path.Data>
                                    <PathGeometry x:Name="PART_ItemMarkerGeometry" />
                                </Path.Data>
                            </Path>
                            <TextBlock x:Name="PART_TextBlock"
                                       Grid.Column="1"
                                       Padding="{TemplateBinding Padding}"
                                       Margin="{TemplateBinding Margin}"
                                       Foreground="{TemplateBinding Foreground}"
                                       Text="{TemplateBinding Label}"
                                       TextWrapping="Wrap" />
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
    <UserControl.DataContext>
        <example:ExampleViewModel />
    </UserControl.DataContext>

    <telerikQuickStart:QuickStart.ExampleHeader>
        <TextBlock Text="Climate Information" Margin="8" />
    </telerikQuickStart:QuickStart.ExampleHeader>

    <Grid>
        <Border telerikQuickStart:ThemeAwareBackgroundBehavior.IsEnabled="True">
            <chart:RadChart x:Name="RadChart1" ItemsSource="{Binding Data}">
                <chart:RadChart.SeriesMappings>
                    <charting:SeriesMapping LegendLabel="Mean total rainfall">
                        <charting:SeriesMapping.SeriesDefinition>
                            <charting:BarSeriesDefinition />
                        </charting:SeriesMapping.SeriesDefinition>
                        <charting:ItemMapping DataPointMember="YValue" FieldName="MeanTotalRainfall" />
                        <charting:ItemMapping DataPointMember="XCategory" FieldName="Month" />
                    </charting:SeriesMapping>
                    <charting:SeriesMapping LegendLabel="Wind speed">
                        <charting:SeriesMapping.SeriesDefinition>
                            <charting:BarSeriesDefinition AxisName="Secondary" />
                        </charting:SeriesMapping.SeriesDefinition>
                        <charting:ItemMapping DataPointMember="YValue" FieldName="WindSpeed" />
                        <charting:ItemMapping DataPointMember="XCategory" FieldName="Month" />
                    </charting:SeriesMapping>
                    <charting:SeriesMapping LegendLabel="Average temperature">
                        <charting:SeriesMapping.SeriesDefinition>
                            <charting:LineSeriesDefinition AxisName="Tertiary" />
                        </charting:SeriesMapping.SeriesDefinition>
                        <charting:ItemMapping DataPointMember="YValue" FieldName="AverageTemperature" />
                        <charting:ItemMapping DataPointMember="XCategory" FieldName="Month" />
                    </charting:SeriesMapping>
                </chart:RadChart.SeriesMappings>
            
                <chart:RadChart.DefaultView>
                    <charting:ChartDefaultView>
                        <charting:ChartDefaultView.ChartArea>
                            <charting:ChartArea LegendName="legend">
                                <charting:ChartArea.AxisY>
                                    <charting:AxisY Title="Mean total rainfall (mm)" AutoRange="False" MinValue="0" MaxValue="80" Step="10">
                                        <charting:AxisY.AxisStyles>
                                            <charting:AxisStyles AxisLineStyle="{StaticResource AxisLineStyle}"
                                                                TickLineStyle="{StaticResource MajorTickLineStyle}"
                                                                MinorTickLineStyle="{StaticResource MinorTickLineStyle}"
                                                                ItemLabelStyle="{StaticResource CustomLabel}"/>
                                        </charting:AxisY.AxisStyles>
                                    </charting:AxisY>
                                </charting:ChartArea.AxisY>
                                <charting:ChartArea.AdditionalYAxes>
                                    <charting:AxisY x:Name="secondaxis" AxisName="Secondary" Title="Wind speed (m/s)"  
                                                   AutoRange="False" MinValue="0" MaxValue="8" Step="1">
                                        <charting:AxisY.AxisStyles>
                                            <charting:AxisStyles AxisLineStyle="{StaticResource AxisLineStyle2}"
                                                                TickLineStyle="{StaticResource MajorTickLineStyle2}"
                                                                MinorTickLineStyle="{StaticResource MinorTickLineStyle2}"
                                                                ItemLabelStyle="{StaticResource CustomLabel2}"/>
                                        </charting:AxisY.AxisStyles>
                                    </charting:AxisY>
                                    <charting:AxisY AxisName="Tertiary" Title="Average temperature (C)" PlotAreaAxisVisibility="Collapsed"
                                                   AutoRange="False" MinValue="-2" MaxValue="22" Step="3">
                                        <charting:AxisY.AxisStyles>
                                            <charting:AxisStyles AxisLineStyle="{StaticResource AxisLineStyle3}"
                                                                TickLineStyle="{StaticResource MajorTickLineStyle3}"
                                                                MinorTickLineStyle="{StaticResource MinorTickLineStyle3}"
                                                                ItemLabelStyle="{StaticResource CustomLabel3}"/>
                                        </charting:AxisY.AxisStyles>
                                    </charting:AxisY>
                                </charting:ChartArea.AdditionalYAxes>
                            </charting:ChartArea>
                        </charting:ChartDefaultView.ChartArea>
                        <charting:ChartDefaultView.ChartLegend>
                            <charting:ChartLegend x:Name="legend" LegendItemStyle="{StaticResource CustomLegendItem}" />
                        </charting:ChartDefaultView.ChartLegend>
                    </charting:ChartDefaultView>
                </chart:RadChart.DefaultView>
            </chart:RadChart>
        </Border> 
    </Grid>
</UserControl>