[Expand]General Information
[Collapse]WinForms Controls
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Expand]Data Grid
  [Expand]Vertical Grid
  [Expand]Property Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Collapse]Chart Control
   [Expand]Getting Started
    [Expand]Charting Basics
    [Expand]Professional Charting
    [Expand]Series Views
    [Collapse]Chart Elements
      [Expand]Diagram Types
        Adding Panes
        Pane Title
        Pane Alignment
        Panes Appearance
      Chart Titles
   [Expand]Providing Data
   [Expand]Appearance Customization
   [Expand]End-User Features
   [Expand]Design-Time Features
   [Expand]Visual Elements
   [Expand]Additional Resources
  [Expand]Map Control
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]PDF Viewer
  [Expand]TreeMap Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Pane Alignment

This document describes how existing panes can be arranged within a chart's diagram. Before reading this text, you may wish to review the basics of using panes in XtraCharts. To learn how additional panes can be created, refer to Adding Panes.

You can determine whether panes should be positioned in a row (horizontally) or in a column (vertically). To do this, use the XYDiagram2D.PaneLayoutDirection property, which is demonstrated in the following image.

The property value

The resulting image

XYDiagram2D.PaneLayoutDirection = Horizontal

XYDiagram2D.PaneLayoutDirection = Vertical

An important characteristic of a pane is its size, which can be defined in one of two ways: relative to another visible pane, or absolutely, irrespective of them. To choose the required behavior, use the XYDiagramPaneBase.SizeMode property.

So, to define the pane's size absolutely, set the XYDiagramPaneBase.SizeMode property to PaneSizeMode.UseSizeInPixels. Assign the desired value to the XYDiagramPaneBase.SizeInPixels property, and the pane will maintain this size regardless of the chart diagram's size. Note that if the value overlaps the size of the diagram, the pane will occupy the entire diagram's area.


Because the sum of all pane sizes can exceed the available space, an increase in one pane's XYDiagramPaneBase.SizeInPixels property causes all panes with a fixed size to be decreased to fit into the chart's area.

Another option is to set the XYDiagramPaneBase.SizeMode property to PaneSizeMode.UseWeight. In this case, the actual size of the pane will be relative; that is, dependant on the values assigned to the XYDiagramPaneBase.Weight properties for other visible panes. These proportions will be maintained after resizing the chart. For example, if the weight is equal for all panes, their size will be similar.

The following images demonstrate the panes' behavior with different size modes set, when the chart is resized.

The property value

The resulting image

ChartControl.Width = 384

ChartControl.Width = 480

In addition, you can define the distance between panes (in pixels), via the XYDiagram2D.PaneDistance property.

Expanded See Also

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