[Expand]General Information
[Expand]WinForms Controls
[Collapse]ASP.NET Controls and MVC Extensions
 [Expand]What's Installed
 [Expand]Common Concepts
 [Collapse]ASP.NET WebForms Controls
   Getting Started
  [Expand]Grid View
  [Expand]Tree List
  [Expand]Card View
  [Collapse]Chart Control
   [Expand]Product Information
   [Expand]Getting Started
    [Collapse]Charting Basics
      Understanding a Data Point, Its Argument and Its Value
      Understanding Series and Series Views
      Understanding a Diagram
      Understanding Axes and Panes
    [Expand]Series Views
    [Expand]Professional Charting
   [Expand]Design-Time Features
   [Expand]Visual Elements
  [Expand]Pivot Grid
  [Expand]Rich Text Editor
  [Expand]Site Navigation and Layout
  [Expand]HTML Editor
  [Expand]Vertical Grid
  [Expand]Data Editors
  [Expand]Docking and Popups
  [Expand]File Management
  [Expand]Data and Image Navigation
  [Expand]Multi-Use Site Controls
  [Expand]Spell Checker
  [Expand]Query Builder
 [Expand]ASP.NET MVC Extensions
 [Expand]Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[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

Understanding Axes and Panes

This topic provides general information about an XY-diagram's axes and panes, and explains the difference between primary and secondary axes.

It consists of the following sections:

Expanded Understanding Axes

A diagram's axes are the main gridlines of reference for series points, as they provide coordinates for their arguments and values. Each diagram type represents axes differently. Most charts use two axes: the axis of arguments (X-axis) and the axis of values (Y-axis). The following image demonstrates axes of the most popular diagram type (XYDiagram2D).

By default, each XY-diagram has only a single pair of axes (X and Y), which are called primary axis. Additional (or, secondary) axes are supported, which is useful when you need to simultaneously display series with a significant value range difference. Refer to Primary and Secondary Axes for more information.

To access primary axis options at design time, select the chart control, and in the Properties window, expand the WebChartControl.Diagram property. You will see the XYDiagram.AxisX and XYDiagram.AxisY properties, which provide access to options and elements of the appropriate axis.

To access the primary axis options at runtime, you should cast your Diagram object to the required diagram type, as demonstrated in the code below.

Similarly, secondary axes are specified via the XYDiagram.SecondaryAxesX and XYDiagram.SecondaryAxesY properties.

The scale type is an important characteristic of an axis, because it determines how a chart interprets its underlying data: as numeric, date-time or qualitative. Each scale type assumes a specific representation of the data, with specific options to customize how the data is displayed. An axis scale type is automatically determined by the scale type of series associated with this axis, so an inappropriate series scale type restricts the available set of axis options, and may cause the chart's data representation to be distorted. Refer to Axis Scale Types to learn more.

The visible range of axis values is automatically determined (while the Range.Auto property is enabled), although you can manually specify two axis values by which an axis should be limited in units appropriate to the axis scale type (via the Range.MinValue and Range.MaxValue properties).

Along an axis, between value pairs, multiple scale breaks can be inserted, to remove space that appears if series point values differ significantly.

Additional elements of an axis are as follows: Axis Titles, Axis Labels, Grid Lines and Tickmarks, Constant Lines and Strips.

See Axes Overview to learn more about axes and their functionality.

Expanded Understanding Panes

A diagram's pane is a rectangular area used to plot series and their associated axes. In general, panes make it possible to distribute multiple series among different areas, which may or may not share their axes (both primary and secondary). Note that panes are available only for the XYDiagram2D type (which includes the XY-Diagram and Swift Plot Diagram).

By default, a chart displays its series in the default pane (represented by an XYDiagramDefaultPane object). Its options can be accessed via the XYDiagram2D.DefaultPane property.

To enable additional panes for a diagram, you can add them to the collection returned by the XYDiagram2D.Panes property. Refer to Adding Panes for details.

See Panes to learn more about panes and their functionality.

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