Class ColumnSeries

The ColumnSeries displays a set of vertical bars for the given data point values.

Inheritance
System.Object
ChartSeries
DataMarkerSeries
CartesianSeries
XyDataSeries
ColumnSeries
Inherited Members
Namespace: Syncfusion.UI.Xaml.Charts
Assembly: Syncfusion.Chart.WinUI.dll
Syntax
public class ColumnSeries : XyDataSeries, ISupportAxes, ISegmentSelectable, ISegmentSpacing
Remarks

To render a series, create an instance of ColumnSeries class, and add it to the Series collection.

It provides options for Fill, PaletteBrushes, StrokeThickness, Stroke, and opacity to customize the appearance.

EnableTooltip - A tooltip displays information while tapping or mouse hovering over a segment. To display the tooltip on chart, need to set the EnableTooltip property as true in ColumnSeries class, and also refer TooltipBehavior property.

Data Label - Data labels are used to display values related to a chart segment. To render the data labels, you need to set the ShowDataLabels property as true in ColumnSeries class. To customize the chart data labels alignment, placement, and label styles, you need to create an instance of CartesianDataLabelSettings and set to the DataLabelSettings property.

Animation - To animate the series, set True to the EnableAnimation property.

LegendIcon - To customize the legend icon using the LegendIcon property.

SegmentSpacing - To specify the spacing between segments using the SegmentSpacing property.

Examples
    <chart:SfCartesianChart>

          <chart:SfCartesianChart.XAxes>
              <chart:NumericalAxis/>
          </chart:SfCartesianChart.XAxes>

          <chart:SfCartesianChart.YAxes>
              <chart:NumericalAxis/>
          </chart:SfCartesianChart.YAxes>

          <chart:ColumnSeries ItemsSource="{Binding Data}"
                            XBindingPath="XValue"
                            YBindingPath="YValue"/>

    </chart:SfCartesianChart>

Constructors

ColumnSeries()

Declaration
public ColumnSeries()

Fields

CustomTemplateProperty

The DependencyProperty for CustomTemplate property.

Declaration
public static readonly DependencyProperty CustomTemplateProperty
Field Value
Type Description
Microsoft.UI.Xaml.DependencyProperty

SegmentSpacingProperty

The DependencyProperty for SegmentSpacing property.

Declaration
public static readonly DependencyProperty SegmentSpacingProperty
Field Value
Type Description
Microsoft.UI.Xaml.DependencyProperty

SelectionBehaviorProperty

The DependencyProperty for SelectionBehavior property. .

Declaration
public static readonly DependencyProperty SelectionBehaviorProperty
Field Value
Type Description
Microsoft.UI.Xaml.DependencyProperty

Properties

CustomTemplate

Gets or sets the template to customize the appearance of column series.

Declaration
public DataTemplate CustomTemplate { get; set; }
Property Value
Type Description
Microsoft.UI.Xaml.DataTemplate

It accepts Microsoft.UI.Xaml.DataTemplate value.
Examples
    <chart:SfCartesianChart>

         <!-- ... Eliminated for simplicity-->
         <chart:ColumnSeries ItemsSource="{Binding Data}"
                                    XBindingPath="XValue"
                                    YBindingPath="YValue">
             <chart:ColumnSeries.CustomTemplate>
                 <DataTemplate>
                     <Canvas>
                         <Rectangle Fill = "{Binding Fill}" Width="{Binding Width}" Height="{Binding Height}"  
                                    Canvas.Left="{Binding RectX}" Canvas.Top="{Binding RectY}" Stroke="{Binding Stroke}"/>
                     </Canvas>
                 </DataTemplate>
             </chart:ColumnSeries.CustomTemplate>
         </chart:ColumnSeries>

    </chart:SfCartesianChart>

SegmentSpacing

Gets or sets a value to indicate spacing between the segments across the series.

Declaration
public double SegmentSpacing { get; set; }
Property Value
Type Description
System.Double

It accepts double values and the default value is 0. Here, the value is between 0 and 1.
Examples
    <chart:SfCartesianChart>

    <!-- ... Eliminated for simplicity-->

         <chart:ColumnSeries ItemsSource="{Binding Data}"
                           XBindingPath="XValue"
                           YBindingPath="YValue"
                           SegmentSpacing = "0.3"/>

    </chart:SfCartesianChart>

SelectionBehavior

Gets or sets a selection behavior that enables you to select or highlight a segment in the series.

Declaration
public DataPointSelectionBehavior SelectionBehavior { get; set; }
Property Value
Type Description
DataPointSelectionBehavior

This property takes the DataPointSelectionBehavior instance as a value, and its default value is null.
Remarks

To highlight the selected data point, set the value for the SelectionBrush property in the DataPointSelectionBehavior class.

Examples
    <chart:SfCartesianChart>

    <!-- ... Eliminated for simplicity-->

         <chart:ColumnSeries ItemsSource="{Binding Data}"
                          XBindingPath="XValue"
                          YBindingPath="YValue">
             <chart:ColumnSeries.SelectionBehavior>
                 <chart:DataPointSelectionBehavior SelectionBrush = "Red" />
             </chart:ColumnSeries.SelectionBehavior>
         </chart:ColumnSeries>

    </chart:SfCartesianChart>
See Also

Explicit Interface Implementations

ISegmentSpacing.CalculateSegmentSpacing(Double, Double, Double)

Declaration
double ISegmentSpacing.CalculateSegmentSpacing(double spacing, double Right, double Left)
Parameters
Type Name Description
System.Double spacing
System.Double Right
System.Double Left
Returns
Type Description
System.Double

Implements

See Also