Essential Chart Silverlight DataBinding

Essential Chart Silverlight supports binding any IEnumerable source. This blog shows a sample HiLo chart bound to stocks.

We have a Stock model object which contains Current Date-Time and the Highest, Lowest, Open and Close Price of each day. The Stock updates class can contain a collection of Stock objects, which are created in XAML by using the following code snippet.

Now, we can bind the stock data to the chart by using the ChartSeries control. The ChartSeries control contains the DataSource, BindingPathX, and BindingPathsY properties to initialize the data for populating the chart. The observable collection of the object is bound with the DataSource property, and the BindingPathX property is used to bind the property name, whose value is going to bind on the X direction. The BindingPathsY property is used to bind the list of property names, whose values are going to bind on the Y direction.

Some chart types require multiple Y values to render a chart. In this example, we use a High-Low-Open-Close chart type for the second series in the chart area. This chart type requires four Y direction values such as the high, low, open, and close price of each day. So the BindingPathsY property is used to initialize the list of property names as a string. The following code snippet shows how to bind data to the ChartSeries control.

The first and last series denote the line curve to show the high and low price of each day in green and red, respectively. I have used the Adornment feature of the chart control to show the highest and lowest price values of each day.

The following XAML code snippet illustrates binding an observable object collection to the Syncfusion Essential Chart Silverlight control. In the following code, I have created an instance for a list of stock values in the user control resources attribute.

Output

 Download the sample source from ChartDataBindingSample.