[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Collapse]WPF Controls
  Prerequisites
 [Expand]What's Installed
 [Expand].NET Core 3 Support
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
   Reporting
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Collapse]Charts Suite
   [Collapse]Chart Control
    [Expand]Getting Started
    [Expand]Fundamentals
    [Expand]Providing Data
    [Expand]Chart Elements
    [Expand]Appearance Customization
    [Expand]End-User Features
    [Expand]Design-Time Features
    [Collapse]Examples
     [Collapse]2D Chart Types
       How to: Create a 2D Area Chart
       How to: Create a 2D Spline Area Chart
       How to: Create a 2D Bubble Chart
       How to: Create a 2D Candle Stick Chart
       How to: Create a 2D Funnel Chart
       How to: Create a 2D Full-Stacked Area Chart
       How to: Create a 2D Full-Stacked Bar Chart
       How to: Create a 2D Full-Stacked Line Chart
       How to: Create a 2D Full-Stacked Spline Area Chart
       How to: Create a 2D Line Chart
       How to: Create a 2D Spline Chart
       How to: Create a 2D Nested Donut Chart
       How to: Create a 2D Overlapped Range Bar Chart
       How to: Create a 2D Pie (Donut) Chart
       How to: Create a 2D Point Chart
       How to: Create a 2D Polar Area Chart
       How to: Create a 2D Polar Line Chart
       How to: Create a 2D Polar Point Chart
       How to: Create a 2D Radar Area Chart
       How to: Create a 2D Radar Line Chart
       How to: Create a 2D Radar Point Chart
       How to: Create a 2D Range Area Chart
       How to: Create a 2D Scatter Line Chart
       How to: Draw a Custom Function in the 2D Scatter Line Chart
       How to: Create a 2D Side-by-Side Bar Chart
       How to: Create a 2D Side-by-Side Full-Stacked Bar Chart
       How to: Create a 2D Side-by-Side Range Bar Chart
       How to: Create a 2D Side-by-Side Stacked Bar Chart
       How to: Create a 2D Stacked Area Chart
       How to: Create a 2D Stacked Bar Chart
       How to: Create a 2D Stacked Line Chart
       How to: Create a 2D Stacked Spline Area Chart
       How to: Create a 2D Stock Chart
       How to: Create a 2D Step Area Chart
       How to: Create a 2D Step Line Chart
       How to: Create a 2D Scatter Polar Line Chart
       How to: Create a 2D Scatter Radar Line Chart
     [Expand]3D Chart Types
     [Expand]Providing Data
     [Expand]Data Representation
     [Expand]Chart Elements
     [Expand]Appearance Customization
     [Expand]End-User Interaction
     [Expand]Miscellaneous
    [Expand]Additional Resources
   [Expand]Chart3D Control
  [Expand]Pivot Grid
  [Expand]Scheduler
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Tree List
  [Expand]Gauge Controls
  [Expand]Map Control
  [Expand]Layout Management
  [Expand]Windows Modern UI
  [Expand]Printing-Exporting
  [Expand]Data Editors
  [Expand]Navigation Controls
  [Expand]Spell Checker
  [Expand]Property Grid
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Gantt Control
  [Expand]Diagram Control
  [Expand]Windows and Utility Controls
   Dialogs, Notifications and Panels
  [Expand]Scheduler (legacy)
 [Expand]Scaffolding Wizard
 [Expand]Localization
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Reporting
[Expand]Report and Dashboard Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

How to: Create a 2D Full-Stacked Bar Chart

This example demonstrates how to create a 2D Full-Stacked Bar chart.

  1. Create a ChartControl (see ChartControl) and set its ChartControl.Diagram property to a XYDiagram2D (see XYDiagram2D) object.

    Note

    The ChartControl.Diagram is a content property. You can declare a diagram in XAML directly after a chart control's declaration without wrapping it in opening and closing ChartControl.Diagram tags.

  2. Specify the Diagram.SeriesItemsSource property to bind a collection of objects used to generate Series.

    The Diagram.SeriesItemTemplate property allows you to define each series item presentation. Use the following API members to configure a series item:

    Member Description
    BarFullStackedSeries2D Represents the 2D Full-Stacked Bar series.
    Series.DataSource Specifies the series's data source.
    Series.ArgumentDataMember Defines the data member that provides the series's arguments.
    Series.ValueDataMember Specifies the data member that provides the series's values.
    Series.DisplayName Gets or sets the display name of the series.
  3. Add an Legend (see Legend) to the ChartControlBase.Legends collection. Refer to the Legend topic for more information about legends.

  4. Add an Title (see Title) to the ChartControlBase.Titles collection. Define the title's Content (see TitleBase.Content) and HorizontalAlignment (see TitleBase.HorizontalAlignment) properties. Refer to the Chart Titles topic for more information about titles.

  5. Use the following API members to configure the axis options.

    Member Description
    XYDiagram2D.AxisY Gets the Y-axis.
    AxisY2D (see AxisY2D) Represents the Y-axis of a XYDiagram2D class.
    AxisBase.Label Provides access to the settings that specify the position and text format of axis labels.
    AxisLabel.TextPattern Gets or sets a format string that specifies the text to be displayed within the axis label.
    AxisY2D.NumericScaleOptions Provides access to the options that define the behavior of a numeric Y-scale when its mode is continuous.
    ContinuousNumericScaleOptions.AutoGrid Gets or sets a value that specifies whether the spacing of grid lines is calculated automatically based upon the major tickmarks of the axis.
    ContinuousNumericScaleOptions.GridSpacing Gets or sets the numeric grid step in grid alignment units.
    XYDiagram2D.AxisX Gets the X-axis.
    AxisX2D (see AxisX2D) Represents the X-axis of a XYDiagram2D class.
    Axis2D.TickmarksMinorVisible Specifies whether the axis minor tick marks are visible. This is a dependency property.

Is this topic helpful?​​​​​​​