Free cookie consent management tool by TermsFeed

Gauge Percentage

SAIL Design System guidance available for Gauges

What gets measured gets done. So measure what matters with gauges. Learn how to configure and display gauges on your interface designs so you can visualize progress on your most important goals and initiatives.

Function

a!gaugePercentage( label, labelPosition, instructions, helpTooltip, percentage, primaryText, secondaryText, color, size, align, accessibilityText, showWhen, tooltip )

Displays the configured percentage of the gauge as an integer for use within the gauge field primaryText parameter.

See also: Gauge design guidance

Parameters

Tip:  This component does not require any parameters. It captures the percentage value from its parent gauge and displays that value in the center, rounded to an integer. The below table is just for reference.

Name Keyword Types Description

Label

label

Text

Text to display as the field label.

Label Position

labelPosition

Text

Determines where the label appears. Valid values: “ABOVE” (default), “ADJACENT”, “JUSTIFIED”, “COLLAPSED”.

Instructions

instructions

Text

Supplemental text about this field.

Help Tooltip

helpTooltip

Text

Displays a help icon with the specified text as a tooltip. The help icon does not show when the label position is “COLLAPSED”.

Percentage

percentage

(Number (Decimal))

Number to display between 0 and 100.

Primary Text

primaryText

Any Type

Content to display on the first line inside the gauge. Create using plain text, a!gaugeIcon(), a!gaugePercentage(), or a!gaugeFraction().

Secondary Text

secondaryText

Text

Optional text to display on the second line inside the gauge.

Color

color

Text

Determines the color. Access the percentage using fv!percentage. Valid values: Any valid hex color or “ACCENT” (default), “POSITIVE”, “NEGATIVE”, “WARN”.

Size

size

Text

Determines the size of the gauge. Valid values: “SMALL”, “MEDIUM” (default), “LARGE”.

Align

align

Text

Determines alignment of the gauge. Valid values: “START”, “CENTER” (default), “END”.

Accessibility Text

accessibilityText

Text

Additional text to be announced by screen readers. Used only for accessibility; produces no visible change.

Visibility

showWhen

Boolean

Determines whether the component is displayed on the interface. When set to false, the component is hidden and is not evaluated. Default: true.

Tooltip

tooltip

Text

Text to display as a tooltip on the gauge.

Examples

Copy and paste an example into the INTERFACE DEFINITION in EXPRESSION MODE to see it displayed.

Use the interactive editor below to test out your code:

Feature compatibility

The table below lists this component's compatibility with various features in Appian.
Feature Compatibility Note
Portals Compatible
Offline Mobile Compatible
Sync-Time Custom Record Fields Incompatible
Real-Time Custom Record Fields Incompatible

Custom record fields that evaluate in real time must be configured using one or more Custom Field functions.

Process Reports Incompatible

Cannot be used to configure a process report.

Process Events Incompatible

Cannot be used to configure a process event node, such as a start event or timer event.

The following patterns include usage of the Gauge Percentage.

Feedback