General Information WinForms Controls .NET Core Support Prerequisites What's Installed Build an Application Controls and Libraries Forms and User Controls Messages, Notifications, and Dialogs Editors and Simple Controls Ribbon, Bars and Menu Application UI Manager Docking Library Data Grid Vertical Grid Property Grid Pivot Grid Tree List Chart Control Diagrams Gauges Getting Started Concepts Gauge Types Visual Elements Appearance Customization Coordinate System Data Binding Saving and Restoring Gauge Layout and Style Settings Design-Time Features Examples Product Information Map Control Scheduler Spreadsheet Rich Text Editor Spell Checker Form Layout Managers Navigation Controls Printing-Exporting PDF Viewer Reporting Snap TreeMap Control Sunburst Control Common Features Get More Help API Reference ASP.NET Controls and MVC Extensions ASP.NET Bootstrap Controls ASP.NET Core Bootstrap Controls WPF Controls Xamarin Controls Windows 10 App Controls Office File API Reporting Report and Dashboard Server Dashboard eXpressApp Framework eXpress Persistent Objects CodeRush CodeRush Classic Cross-Platform Core Libraries Tools and Utilities End-User Documentation
View this topic on docs.devexpress.com (Learn more)

# Coordinate System

This document provides information on how gauges are measured within a Gauge Control, what the gauge Z Order is, as well as detailing how to specify angles of gauge specific elements.

## Measuring Along the X and Y Axes

A Gauge Control can display multiple gauges of different types at the same time. Each gauge is drawn within a specific painting area - cell, which has its own relative coordinate system. In most cases, the origin of the coordinate system is the left-top corner of the painting cell, with the X axis pointing to the right and the Y axis pointing down.

Painting cells have real bounds within the gauge control. However, gauges within cells are not aware of these real sizes and coordinates.

The coordinate system within each cell is relative. The origin of the coordinate system is the point with the coordinates of (0,0), which is in most cases positioned at the left-top corner of the cell. For most gauge types, a cell's relative width and height are fixed, and these values are dependant upon the gauge type. Note that these values do not depend upon the real bounds of the cell.

For circular gauges, a cell has a relative width and height equal to 250:

For linear gauges, a cell's dimension along the X axis is 125, and the dimension along the Y axis is 250:

Important

Note that for linear gauges oriented horizontally, the coordinate system is rotated 90 degrees clock-wise. The top-right corner has an x,y coordinate of (0,0), and the X axis points down and the Y axis points to the left:

For digital gauges, a cell's relative height is equal to 100, and the width is calculated automatically to keep its proportions:

For state indicator gauges, the coordinate system is like the one for circular gauges. A cell has a relative width and height equal to 250:

## Z Order

Although a gauge is two-dimensional, it's composed of overlapping layers displaying various gauge elements (the background layer, one or more scales, needles, etc). All of these layers are positioned above each other and their positions along the Z axis are determined by the ZOrder.

Layers with higher ZOrders are positioned below layers with lower ZOrders. For instance, needles within circular gauges have negative ZOrders, and so they are displayed above all other layers.

## Measuring Angles

Circular gauges allow you to customize angles of specific elements (for instance, the starting and ending angles of a scale). Angles are measured in degrees, starting from the X axis clockwise. The following image shows how angles are specified in circular gauges:

For more information on circular gauge elements, see Circular Gauges

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