This step binds the FinancialChart control to a valid data source. 

1. Create the data source as follows:
   1. Right-click the project and select Add | Class.
   2. Select Class from the list of templates, name it as DataService, and click Add.
   3. Add the following code in DataService class to generate the data.
   • Visual Basic
   • C#

   • Visual Basic

   Class DataService
       Public Shared Function CreateData() As List(Of DataItem)
           Dim data = New List(Of DataItem)()
   
           Dim dt As DateTime = DateTime.Today
   
           data.Add(New DataItem(dt.[Date], 79))
           data.Add(New DataItem(dt.[Date].AddDays(-7), 78))
           data.Add(New DataItem(dt.[Date].AddDays(-14), 73))
           data.Add(New DataItem(dt.[Date].AddDays(-21), 74))
           data.Add(New DataItem(dt.[Date].AddDays(-28), 76))
           data.Add(New DataItem(dt.[Date].AddDays(-35), 74))
           data.Add(New DataItem(dt.[Date].AddDays(-42), 75))
           data.Add(New DataItem(dt.[Date].AddDays(-49), 75))
           data.Add(New DataItem(dt.[Date].AddDays(-56), 80))
           Return data
       End Function
   End Class
   
   Public Class DataItem
       Public Sub New(date__1 As DateTime, sales__2 As Integer)
           [Date] = date__1
           Sales = sales__2
       End Sub
   
       Public Property [Date]() As DateTime
           Get
               Return m_Date
           End Get
           Set
               m_Date = Value
           End Set
       End Property
       Private m_Date As DateTime
       Public Property Sales() As Integer
           Get
               Return m_Sales
           End Get
           Set
               m_Sales = Value
           End Set
       End Property
       Private m_Sales As Integer
   End Class
   

   • C#

   class DataService
   {
       public static List<DataItem> CreateData()
       {
           var data = new List<DataItem>();
   
           DateTime dt = DateTime.Today;
   
           data.Add(new DataItem(dt.Date, 79));
           data.Add(new DataItem(dt.Date.AddDays(-7), 78));
           data.Add(new DataItem(dt.Date.AddDays(-14), 73));
           data.Add(new DataItem(dt.Date.AddDays(-21), 74));
           data.Add(new DataItem(dt.Date.AddDays(-28), 76));
           data.Add(new DataItem(dt.Date.AddDays(-35), 74));
           data.Add(new DataItem(dt.Date.AddDays(-42), 75));
           data.Add(new DataItem(dt.Date.AddDays(-49), 75));
           data.Add(new DataItem(dt.Date.AddDays(-56), 80));
           return data;
       }
   }
   
   public class DataItem
   {
       public DataItem(DateTime date, int sales)
       {
           Date = date;
           Sales = sales;
       }
   
       public DateTime Date { get; set; }
       public int Sales { get; set; }
   }
   

2. Bind the data to FinancialChart as follows:        
   
   
   1. Edit the <Grid> tag to the following markup to provide data to FinancialChart:
      • MainPage.xaml

          <Page
          xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
          xmlns:local="using:Quick_Start"
          xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
          xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
          xmlns:Finance="using:C1.Xaml.Chart.Finance"
          x:Class="Quick_Start.MainPage"
          DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}"
          mc:Ignorable="d">
      
          <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
              <Finance:C1FinancialChart x:Name="financialChart"
                                        ChartType="LineSymbols"
                                        ItemsSource="{Binding DataContext.Data}"
                                        HorizontalAlignment="Left"
                                        Height="321"
                                        VerticalAlignment="Top"
                                        Width="620"
                                        Margin="79,85,0,0">
                  <Finance:FinancialSeries AxisX="{x:Null}"
                                           AxisY="{x:Null}"
                                           Binding="Sales"
                                           BindingX="Date"
                                           Chart="{x:Null}"
                                           SeriesName="{x:Null}">
                  </Finance:FinancialSeries>
              </Finance:C1FinancialChart>
          </Grid>
      </Page>
      

   2. Switch to Code view (MainPage.xaml.cs). Add the following code in the MainPage class to plot the data in the chart
      
      • MainPage.xaml.vb
      • MainPage.xaml.cs

      • MainPage.xaml.vb

      Partial Public NotInheritable Class MainPage
          Inherits Page
          Private _data As List(Of DataItem)
      
          Public Sub New()
              Me.InitializeComponent()
          End Sub
      
          Public ReadOnly Property Data() As List(Of DataItem)
              Get
                  If _data Is Nothing Then
                      _data = DataService.CreateData()
                  End If
      
                  Return _data
              End Get
          End Property
      
      End Class
      

      • MainPage.xaml.cs

      public sealed partial class MainPage : Page
      {
          private List<DataItem> _data;
      
          public MainPage()
          {
              this.InitializeComponent();
          }
      
          public List<DataItem> Data
          {
              get
              {
                  if (_data == null)
                  {
                      _data = DataService.CreateData();
                  }
      
                  return _data;
              }
          }
      
      }
      

The FinancialChart control is successfully bound to the data source.