SideBySideBarSeriesView Class

The Side-by-Side Bar series view.

Assembly: DevExpress.WinUI.Charts.v21.1.dll

Declaration

C#
VB.NET

public class SideBySideBarSeriesView :
    BarSeriesView,
    IBarSideBySideSeriesView

Public Class SideBySideBarSeriesView
    Inherits BarSeriesView
    Implements IBarSideBySideSeriesView

Remarks

Use the Series.View property to define the series view type.

The following example creates a Side-by-Side Bar chart:

Side-by-Side Bar series view

XAML

<Common:DemoModuleView
   x:Class="ChartsDemo.BarSeriesViewModule"
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:Charts="using:DevExpress.WinUI.Charts"
   xmlns:Common="using:FeatureDemo.Common"
   BorderBrush="Transparent">
   <Grid>
       <Grid.RowDefinitions>
           <RowDefinition Height="Auto" />
       </Grid.RowDefinitions>
       <Charts:CartesianChart x:Name="chart" Grid.Row="0">
           <Charts:CartesianChart.AxisY>
               <Charts:AxisY>
                   <Charts:AxisY.Title>
                       <Charts:AxisTitle Content="Population in millions" />
                   </Charts:AxisY.Title>
               </Charts:AxisY>
           </Charts:CartesianChart.AxisY>
           <Charts:CartesianChart.Legend>
               <Charts:Legend
               Margin="5"
               Orientation="Vertical"
               HorizontalPosition="Right"
               VerticalPosition="Top"
               Background="White"
               BorderBrush="Gray" />
           </Charts:CartesianChart.Legend>
           <Charts:CartesianChart.Series>
               <Charts:Series DisplayName="0 - 14 years">
                   <Charts:Series.View>
                       <Charts:SideBySideBarSeriesView  BarWidth="0.2" />
                   </Charts:Series.View>
                   <Charts:Series.Data>
                       <Charts:DataSourceAdapter DataSource="{Binding Series1Data}">
                           <Charts:DataMember DataMemberType="Argument" ColumnName="CountryName" />
                           <Charts:DataMember DataMemberType="Value" ColumnName="PopulationValue" />
                       </Charts:DataSourceAdapter>
                   </Charts:Series.Data>
               </Charts:Series>
               <Charts:Series  DisplayName="15 - 64 years">
                   <Charts:Series.View>
                       <Charts:SideBySideBarSeriesView BarWidth="0.2"  />
                   </Charts:Series.View>
                   <Charts:Series.Data>
                       <Charts:DataSourceAdapter DataSource="{Binding Series2Data}">
                           <Charts:DataMember DataMemberType="Argument" ColumnName="CountryName" />
                           <Charts:DataMember DataMemberType="Value" ColumnName="PopulationValue" />
                       </Charts:DataSourceAdapter>
                   </Charts:Series.Data>
       </Charts:Series>
       <Charts:Series  DisplayName="65 years and older">
                   <Charts:Series.View>
                       <Charts:SideBySideBarSeriesView BarWidth="0.2" />
                   </Charts:Series.View>
                   <Charts:Series.Data>
                           <Charts:DataSourceAdapter DataSource="{Binding Series3Data}">
                               <Charts:DataMember DataMemberType="Argument" ColumnName="CountryName" />
                               <Charts:DataMember DataMemberType="Value" ColumnName="PopulationValue" />
                           </Charts:DataSourceAdapter>
                   </Charts:Series.Data>
       </Charts:Series>
           </Charts:CartesianChart.Series>
       </Charts:CartesianChart>
   </Grid>
</Common:DemoModuleView>

C#
VB.NET

using DevExpress.WinUI.Charts;
using Microsoft.UI.Xaml;
using FeatureDemo.Common;
using System.Collections.Generic;

namespace ChartsDemo {
   public sealed partial class BarSeriesViewModule : DemoModuleView {
       public BarSeriesViewModule() {
           DataContext = new BarSeriesViewModel();
       }
   }
   public class BarSeriesViewModel : DevExpress.Mvvm.BindableBase {
       private List<Population> series1Data;
       private List<Population> series2Data;
       private List<Population> series3Data;

       public List<Population> Series1Data {
           get { return series1Data; }
           set { SetProperty(ref series1Data, value); }
       }
       public List<Population> Series2Data {
           get { return series2Data; }
           set { SetProperty(ref series2Data, value); }
       }
       public List<Population> Series3Data {
           get { return series3Data; }
           set { SetProperty(ref series3Data, value); }
       }
       public BarSeriesViewModel() {
           Series1Data = new List<Population>() {
               new Population("US", 58.553),
               new Population("Japan", 18.680),
               new Population("Germany", 13.012),
               new Population("UK", 11.335)
           };
           Series2Data = new List<Population>() {
               new Population("US", 182.181),
               new Population("Japan", 86.343),
               new Population("Germany", 56.331),
               new Population("UK", 38.85)
           };

           Series3Data = new List<Population>() {
               new Population("US", 34.834),
               new Population("Japan", 21.525),
               new Population("Germany", 13.451),
               new Population("UK", 9.323)
           };
       }
       public class Population {
           public string CountryName { get; set; }
           public double PopulationValue { get; set; }
           public Population(string companyName, double populationValue) {
               CountryName = companyName;
               PopulationValue = populationValue;
           }
       }
   }
}

Imports DevExpress.WinUI.Charts
Imports Microsoft.UI.Xaml
Imports FeatureDemo.Common
Imports System.Collections.Generic

Namespace ChartsDemo
   Public NotInheritable Partial Class BarSeriesViewModule
       Inherits DemoModuleView

       Public Sub New()
           DataContext = New BarSeriesViewModel()
       End Sub
   End Class

   Public Class BarSeriesViewModel
       Inherits DevExpress.Mvvm.BindableBase

       Private series1DataField As List(Of Population)
       Private series2DataField As List(Of Population)
       Private series3DataField As List(Of Population)

       Public Property Series1Data As List(Of Population)
           Get
               Return series1DataField
           End Get
           Set(ByVal value As List(Of Population))
               SetProperty(series1DataField, value)
           End Set
       End Property

       Public Property Series2Data As List(Of Population)
           Get
               Return series2DataField
           End Get
           Set(ByVal value As List(Of Population))
               SetProperty(series2DataField, value)
           End Set
       End Property

       Public Property Series3Data As List(Of Population)
           Get
               Return series3DataField
           End Get
           Set(ByVal value As List(Of Population))
               SetProperty(series3DataField, value)
           End Set
       End Property

       Public Sub New()
           Series1Data = New List(Of Population)() From {
               New Population("US", 58.553),
               New Population("Japan", 18.680),
               New Population("Germany", 13.012),
               New Population("UK", 11.335)
           }
           Series2Data = New List(Of Population)() From {
               New Population("US", 182.181),
               New Population("Japan", 86.343),
               New Population("Germany", 56.331),
               New Population("UK", 38.85)
           }
           Series3Data = New List(Of Population)() From {
               New Population("US", 34.834),
               New Population("Japan", 21.525),
               New Population("Germany", 13.451),
               New Population("UK", 9.323)
           }
       End Sub

       Public Class Population
           Public Property CountryName As String
           Public Property PopulationValue As Double

           Public Sub New(ByVal companyName As String, ByVal populationValue As Double)
               CountryName = companyName
               Me.PopulationValue = populationValue
           End Sub
       End Class
   End Class
End Namespace

For step-by-step instructions on how to create a Cartesian chart, refer to the following help topic: Lesson 1 - Create a Cartesian Chart.