<Page x:Class="DataManipulation.TopNView"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="using:DataManipulation"
      xmlns:c1="using:C1.Xaml.Chart"
      xmlns:Annotation="using:C1.Xaml.Chart.Annotation"
      mc:Ignorable="d" 
      d:DesignHeight="600" d:DesignWidth="600">
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.DataContext>
            <local:TopNViewModel x:Name="topNViewModel" />
        </Grid.DataContext>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <StackPanel MinHeight="48" Grid.Row="0" Orientation="Horizontal">
            <ComboBox x:Name="cbTopNCount" Margin="5" MinWidth="120" ItemsSource="{Binding TopNCounts}"  DisplayMemberPath="Key" SelectedValuePath="Value"  SelectedValue="{Binding TopNCount, Mode=TwoWay}"/>
            <CheckBox x:Name="chkShowOthers" Margin="5"  Content="Show others" IsChecked="{Binding ShowOthers, Mode=TwoWay}"   />
        </StackPanel>

        <c1:C1FlexChart x:Name="flexChart1" Grid.Row="1"
                            Header="2016 Top 10 smartphone vendors" BindingX="Name" ItemsSource="{Binding DataSource}" SeriesVisibilityChanged="flexChart1_SeriesVisibilityChanged">
            <c1:Series SeriesName="Shipments" Binding="Shipments"/>
        </c1:C1FlexChart>

    </Grid>
</Page>
