<UserControl
    x:Class="ChartSamples.Bubble"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:ChartSamples"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:c1="using:C1.Xaml.Chart"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">
    <UserControl.Resources>
        <local:ToolTipConverter x:Key="ttc" />
        <DataTemplate x:Key="tooltip">
            <TextBlock Text="{Binding Converter={StaticResource ttc}}" Margin="0 0 0 20"/>
        </DataTemplate>
        <ResourceDictionary x:Key="brushes">
            <LinearGradientBrush x:Key="brush0" EndPoint="1,0" StartPoint="0,0">
                <GradientStop Color="#FFFDEE50" Offset="0.17"/>
                <GradientStop Color="#FFE0A608" Offset="0.33"/>
                <GradientStop Color="#FFE0E0E0" Offset="0.33"/>
                <GradientStop Color="#FF939393" Offset="0.67"/>
                <GradientStop Color="#FFEEB979" Offset="0.67"/>
                <GradientStop Color="#FFB1723E" Offset="0.83"/>
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="brush1" EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FFEEB979" Offset="0.4"/>
                <GradientStop Color="#FFB1723E" Offset="0.6"/>
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="brush2" EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FFE0E0E0" Offset="0.4"/>
                <GradientStop Color="#FF939393" Offset="0.6"/>
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="brush3" EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FFFDEE50" Offset="0.4"/>
                <GradientStop Color="#FFE0A608" Offset="0.6"/>
            </LinearGradientBrush>
        </ResourceDictionary>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition />
        </Grid.RowDefinitions>
        <TextBlock FontSize="20" TextAlignment="Center" Text="Olympic medals by country"/>
        <c1:C1Chart Grid.Row="1" Margin="1" Name="chart" 
                    Background="Transparent" BorderBrush="Transparent" 
                 ChartType="Bubble" CustomPalette="{StaticResource brushes}"
>
            <c1:C1Chart.Data>
                <c1:ChartData>
                    <c1:ChartData.Children>
                    <c1:BubbleSeries Label="Total"
                         Values="0 0 0 1 1 1 2 2 2" 
                         XValues="0 1 2 0 1 2 0 1 2"  
                         SizeValues="92 102 110 59 63 100 88 92 72"
                         SymbolSize="14,14"
                         PointTooltipTemplate="{StaticResource tooltip}"/>
                    <c1:BubbleSeries Label="Bronze" 
                         Values="0 0 0 1 1 1 2 2 2" 
                         XValues=".2 1.2 2.2 .2 1.2 2.2 .2 1.2 2.2"
                         SizeValues="31 27 36 15 14 28 28 38 28"
                         SymbolSize="14,14"
                         PointTooltipTemplate="{StaticResource tooltip}"/>
                    <c1:BubbleSeries Label="Silver"
                         Values="0 0 0 1 1 1 2 2 2"
                         XValues="0 1 2 0 1 2 0 1 2"
                         SizeValues="24 39 38 16 17 21 28 27 21"
                         SymbolSize="14,14"
                         PointTooltipTemplate="{StaticResource tooltip}"/>
                    <c1:BubbleSeries Label="Gold"
                         Values="0 0 0 1 1 1 2 2 2"
                         XValues="-0.2 0.8 1.8 -0.2 0.8 1.8 -0.2 0.8 1.8"
                         SizeValues="36 36 36 28 32 51 32 27 23"
                         SymbolSize="14,14"
                         PointTooltipTemplate="{StaticResource tooltip}"/>
                    </c1:ChartData.Children>
                </c1:ChartData>
            </c1:C1Chart.Data>
            <c1:C1ChartLegend Background="Transparent" BorderBrush="Transparent"/>
        </c1:C1Chart>
    </Grid>
</UserControl>
