DataBinding Overview

DataBinding allows you to automatically generate a DataSeries from any collection of type IEnumerable and keep it synced. Below is an example showing how you can bind DataSeries to a Data Source.

<vc:Chart Name="MyChart" Width="500" Height="300" Theme="Theme1">

   <vc:Chart.Series>

       <vc:DataSeries RenderAs="Column" DataSource="{Binding}">

           <vc:DataSeries.DataMappings>
               <vc:DataMapping MemberName="XValue" Path="Key"></vc:DataMapping>
                <vc:DataMapping MemberName="YValue" Path="Value"></vc:DataMapping>
            </vc:DataSeries.DataMappings>

       </vc:DataSeries>

    </vc:Chart.Series>

</vc:Chart>

Now from code behind, we will create an ObservableCollection of KeyValuePair and set as the DataContext of Chart.

public partial class Page : UserControl
{
    public Page()
    {
        InitializeComponent();

        for (int i = 0; i < 10; i++)
        {
            values.Add(new KeyValuePair<double,double>(i, i + 1));
        }

        MyChart.DataContext = values;
    }

    Random rand = new Random();
    ObservableCollection<KeyValuePair<Double, Double>> values = new ObservableCollection<KeyValuePair<double, double>>();
}

In the above example, we have created a collection of KeyValuePair with Key and Value being String values. In the XAML, we are mapping the "Key" to XValue of DataPoint and "Value" to YValue of DataPoint using DataMapping element. Now, as the DataContext of Chart is set to "values", DataSeries fetches values from the same to generate corresponding DataPoints.

You can bind all properties of DataPoint including:

AxisXLabel

XValue

YValue

YValues

Open

High

Low