The RangeCircularGauge control implements a circular gauge to specify colors according to the range of the primary variable. It defines the title, adds center text, links to a specific data value, and sets range start and end values. It customizes the gauge arc's start and sweep angles and sets the pointer type. The control configures the legend display, shape, and position. Users can define range segments, their start and end values, color, width, and rounding radius, and assign legend labels, allowing real-time data visualization and differentiation of gauge segments.
On this page:
Requirements
This component is Portable. It runs both on Windows and on Web Pages hosted in any platform.
Configuration
- Go to Displays / Draw.
- On the Components Panel, select Gauges, then RangeCircularGauge.
- Click or drag-and-drop it on the Drawing area to use it.
- Double-click the object to open the configuration window.
Range Circular Gauge Settings | |
|---|---|
Field | Description |
Header | Defines the title of the gauge. |
Header FontSize | Defines the font size of the header text, enabling customization of text appearance for readability. |
Alignment | Determines the position of the header within the gauge, offering the following placement options: Top: Positions the header at the center of the gauge's top boundary. This alignment places the text horizontally centered while ensuring it remains above the gauge components, making it suitable for a prominent title display. Bottom: Places the header at the center of the gauge's bottom boundary. The text aligns horizontally at the gauge’s width midpoint, positioned at the lowest point to serve as a footer or additional information label. TopLeft: Aligns the header at the top-left corner of the gauge. The text is positioned to align with the leftmost edge of the gauge, providing a corner placement that allows space for other gauge elements and UI components. TopRight: Positions the header at the top-right corner of the gauge. The text aligns with the rightmost boundary while remaining at the top, ensuring that it does not interfere with other gauge elements. This placement is useful for right-aligned layouts. BottomLeft: Places the header at the bottom-left corner of the gauge. The text aligns to the left side while being positioned at the bottom edge, offering a subtle and unobtrusive placement for contextual information. BottomRight: Aligns the header at the bottom-right corner of the gauge. The text is positioned at the rightmost edge and bottom boundary, ensuring it complements right-aligned design elements and maintains a balanced visual structure. |
Center Text | Allows the user to add text in the center of the gauge. |
Linked Value | Links a specific data value or source to the gauge. |
Range Start | Defines the minimum value the gauge can represent. Default is 0. |
Range End | Specifies the maximum value the gauge can represent. Default is 100. |
Start Angle | Determines the starting angle of the gauge arc. This customization allows the gauge to start at a specified point on the circle. Default is 135. |
Sweep Angle | Defines the extent of the gauge arc in degrees. This determines how much of the circle the gauge will cover. Default is 270. |
Pointer Type | Defines the type of pointer used in the gauge (e.g., RangePointer). Customizes the pointer style. NeedlePointer: This pointer type represents the data value with a needle-like indicator. It is commonly used to provide a precise and clear indication of the current value on the gauge. RangePointer: This pointer type highlights a range on the gauge. It is useful for visualizing a span of values rather than a single point, allowing users to see the current range of interest. SymbolPointer: This pointer type uses a symbol to indicate the data value. |
Legend | Enables the legend display. |
Legend Shape | Defines the legend shape (Triangle, Circle, Diamond, or Rectangle). |
Position | Defines the legend position from Auto: Automatically positions the legend based on the available space and layout. Bottom: Positions the legend at the bottom of the gauge. Left: Positions the legend to the left of the gauge. Right: Positions the legend to the right of the gauge. Top: Positions the legend at the top of the gauge. |
Range | Indicates the specific range segment. Users can enable or disable each range by marking the checkbox next to the range entry. |
Range Start and End | Defines the starting and ending values for each range segment. This setting determines the minimum and maximum values for each color segment of the gauge. |
Color | Specifies the color for each range segment. This setting allows users to visually differentiate between various segments of the gauge. |
Start and End Width | Defines the width of the start and end points of each range segment. This setting determines the thickness of the segment boundaries on the gauge. |
Rounded | Determines if the ends of each range segment are rounded. Users can specify the rounding radius. |
Legend | Allows users to assign a legend label to each range segment. This setting helps in identifying the purpose of each color segment on the gauge. |
Runtime Execution
During runtime, the RangeCircularGauge control visualizes data by displaying a range of colors that correspond to the values of the primary variable. The control allows users to set titles, center text, and link the gauge to a specific data value. Users can also customize the gauge’s arc by adjusting the start and sweep angles, as well as the pointer type. The control offers configuration options for the legend, including display, shape, and position. Range segments are defined by users, who can set their start and end values, color, width, and rounding radius. Legend labels can be assigned to these segments, facilitating the differentiation and real-time visualization of data within the gauge.
In this section: