The Semi Circle Circular Gauge defines a gauge that visually represents data within a specified range. Users set the gauge title, adjust header and label font sizes, link to a data source, and establish range start and end values. They also configure the rim thickness and stroke width. Users select target data, configure these settings, and integrate the gauge into dashboards or reports. This process facilitates real-time data visualization and differentiation of data segments. The SemiCircleCircularGauge implements a CircularGauge that shows the top semi-circle and displays the value.

On this page:



Requirements

This component is Portable. It runs both on Windows and on Web Pages hosted in any platform.


Configuration

  1. Go to Displays / Draw.
  2. On the Components Panel, select Gauges, then SemiCircleCircularGauge.
  3. Click or drag-and-drop it on the Drawing area to use it.
  4. Double-click the object to open the configuration window.

Semi Circle Circular Gauge Settings

Field

Description

Header

Defines the title of the gauge.

Header Font size

Adjusts the font size of the header text.

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.

Linked Value

Links a specific data value or source to the gauge.

Range Start

Defines the starting value of the gauge range, that is, the minimum value the gauge can represent.

Range End

Specifies the ending value of the gauge range, that is, the maximum value the gauge can represent.

Label Font Size

Adjusts the font size of the label text.

Rim Thickness

Specifies the thickness of the outer rim of the gauge. Affects the visual weight and prominence of the gauge.

Stroke

Adjusts the stroke width of the gauge arc. Influences the visual clarity and emphasis of the gauge.


Runtime Execution 

During runtime, the SemiCircleCircularGauge control operates as an interactive display, representing data within a semi-circular format. Users have previously configured the gauge with a title, header and label font sizes, data source linkage, and range values. The rim thickness and stroke width are also set according to the application’s design requirements. As the target data changes, the gauge reflects these updates, integrating seamlessly into dashboards or reports for real-time data visualization. This control aids users in distinguishing different data segments, with the top semi-circle effectively showcasing the value in a visually concise manner.


In this section:

  • No labels