SeriesTemplateAdapter.SeriesTemplate Property

Specifies the template for generated series.

Namespace: DevExpress.XamarinForms.Charts

Assembly: DevExpress.XamarinForms.Charts.dll

NuGet Package: DevExpress.XamarinForms.Charts

Declaration

public DataTemplate SeriesTemplate { get; set; }

Property Value

Type	Description
DataTemplate	A template that contains a series with adjusted settings.

Example

In this example, the chart generates bar series that visualize GDP per capita by year for the G7 from 2017 to 2019.

1. Create a data source for series generation. Each object in the list stores a country’s name, year, and the GDP value for this year.

   C#

   using System.Collections.Generic;
   
   namespace SeriesTemplateExample {
       public class ViewModel {
           CountryYearlyStatisticsData data = new CountryYearlyStatisticsData();
           public List<CountryGdpStatistics> SeriesData => this.data.SeriesData;
       }
   
       public class CountryYearlyStatisticsData {
           public List<CountryGdpStatistics> SeriesData { get; } = new List<CountryGdpStatistics> {
               new CountryGdpStatistics("UK", 45903.9, 2017),
               new CountryGdpStatistics("UK", 48651.6, 2018),
               new CountryGdpStatistics("UK", 49912.4, 2019),
               new CountryGdpStatistics("USA", 60091.6, 2017),
               new CountryGdpStatistics("USA", 63043.0, 2018),
               new CountryGdpStatistics("USA", 65240.4, 2019),
               new CountryGdpStatistics("Canada", 48479.8, 2017),
               new CountryGdpStatistics("Canada", 51106.9, 2018),
               new CountryGdpStatistics("Canada", 51822.2, 2019),
               new CountryGdpStatistics("Japan", 41119.4, 2017),
               new CountryGdpStatistics("Japan", 42840.2, 2018),
               new CountryGdpStatistics("Japan", 43642.7, 2019),
               new CountryGdpStatistics("France", 44622.8, 2017),
               new CountryGdpStatistics("France", 47922.2, 2018),
               new CountryGdpStatistics("France", 50693.5, 2019),
               new CountryGdpStatistics("Germany", 53122.0, 2017),
               new CountryGdpStatistics("Germany", 56689.0, 2018),
               new CountryGdpStatistics("Germany", 57557.9, 2019),
               new CountryGdpStatistics("Italy", 41713.9, 2017),
               new CountryGdpStatistics("Italy", 44444.7, 2018),
               new CountryGdpStatistics("Italy", 45691.0, 2019),
           };
       }
   
       public class CountryGdpStatistics {
           public string Country { get; private set; }
           public double Gdp { get; private set; }
           public int Year { get; private set; }
   
           public CountryGdpStatistics(string country, double gdp, int year) {
               Country = country;
               Gdp = gdp;
               Year = year;
           }
       }
   }
   

2. Set the ChartView.SeriesDataTemplate property to a SeriesTemplateAdapter object with the following properties specified (all these settings are required for series generation):

   • DataSource – the data source for chart series.
   • SeriesDataMember – a data source field whose unique values identify series.
   • ArgumentDataMember – a data source field that contains arguments for series points. Each point requires one argument value.
   • ValueDataMembers – a collection of data source fields that contain values for series points. The number of fields you need to specify in this collection depends on the series type – some series (for example, Bubble or Stock) require more than one value for each argument.
   • SeriesTemplate – a template that defines the type of generated series and configures series settings and elements. This template’s binding context is a SeriesTemplateData object. Its SeriesDataMemberValue property returns values of the data source field assigned to SeriesDataMember. Bind this property to the series DisplayName.
   XAML

   <ContentPage xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                xmlns:dxc="http://schemas.devexpress.com/xamarin/2014/forms/charts"
                xmlns:local="clr-namespace:SeriesTemplateExample"
                x:Class="SeriesTemplateExample.MainPage">
       <ContentPage.BindingContext>
           <local:ViewModel/>
       </ContentPage.BindingContext>
       <dxc:ChartView>
           <dxc:ChartView.SeriesDataTemplate>
               <dxc:SeriesTemplateAdapter DataSource="{Binding SeriesData}"
                                          SeriesDataMember="Country"
                                          ArgumentDataMember="Year">
                   <dxc:SeriesTemplateAdapter.ValueDataMembers>
                       <dxc:ValueDataMember Type="Value" Member="Gdp"/>
                   </dxc:SeriesTemplateAdapter.ValueDataMembers>
                   <dxc:SeriesTemplateAdapter.SeriesTemplate>
                       <DataTemplate>
                           <dxc:BarSeries DisplayName="{Binding Path=SeriesDataMemberValue}"/>
                       </DataTemplate>
                   </dxc:SeriesTemplateAdapter.SeriesTemplate>
               </dxc:SeriesTemplateAdapter>
           </dxc:ChartView.SeriesDataTemplate>
           <dxc:ChartView.AxisY>
               <dxc:NumericAxisY AlwaysShowZeroLevel="False">
                   <dxc:NumericAxisY.Style>
                       <dxc:AxisStyle MajorTickmarksVisible="True"
                                      MinorTickmarksVisible="True"/>
                   </dxc:NumericAxisY.Style>
                   <dxc:NumericAxisY.Title>
                       <dxc:AxisTitle Text="Total GDP per capita, USD"/>
                   </dxc:NumericAxisY.Title>
               </dxc:NumericAxisY>
           </dxc:ChartView.AxisY>
           <dxc:ChartView.AxisX>
               <dxc:NumericAxisX GridAlignment="1"/>
           </dxc:ChartView.AxisX>
           <dxc:ChartView.Legend>
               <dxc:Legend/>
           </dxc:ChartView.Legend>
       </dxc:ChartView>
   </ContentPage>
   

ChartView displays generated series in addition to series that you define in the Series collection.