1. Setting up gauges

1.1. Steps to add a gauge and configure its display

Note: The Select form dropdown lists all the forms in the application you are currently working on. To select a form from another application, click Change App in the footer of the form dropdown. Select another application and click Done to view all of its forms.
 

Note: If there is only one numeric field available in that form, it will be auto-selected by default.

1. All records - Evaluate all the records from the selected form
2. Selected records - Evaluate a specific set of records that satisfy a criterion, to configure the operation.

1. Actual (Applicable for all operations)
   The actual result of the operation. This is the default value.
2. Percentage of total (Applicable for Minimum, Maximum, Median)
   Say the result of the arithmetic operation is 24 and the sum of all values recorded for that field is 240. Then the displayed percentage will be 10%.
3. Percentage of a number (Applicable for Sum, Minimum, Maximum, Median, Average, Distinct Count)
   Say the result of the arithmetic operation is 30 and the specified value under Numeric Value for the percentage is 120. Then the gauge will display 25%.
   

1. Fraction with the total in denominator (Applicable for Minimum, Maximum, Median)
   Say the result of the arithmetic operation is 24 and the sum of all values recorded for that field is 240. Then the displayed fraction will be 1/10.
   

1. Percentage (Applicable for Count)
   
1. Choose a field from the Field dropdown whose values need to be evaluated to calculate the percentage.
   
2. Enter the field values which have to be counted and tallied against the total number of records to find the percentage.
   
2. Fraction (Applicable for Count)
   
1. Choose a field from the Field dropdown whose values need to be evaluated to calculate the percentage.
   
2. Enter the field values which have to be counted and tallied against the total number of records to find the fraction.
   

Note: The target value can only be lesser than or equal to the maximum value.

1. Choose the number of ranges that can be included to differentiate between stages or progress sections on the gauge. The available options are 2 (default value), 3, 4.
   
2. Drag the knobs along the track to adjust the static thresholds of the included ranges. The percentage values of each range are shown dynamically as the knobs are dragged to different positions.
   
   

1.2. Configure style

Note: If the gauge was previously created, select the gauge from the page builder and click Configure to open the Gauge Configuration pane. Alternately, double click the gauge to open the configuration pane.

Property		Steps
General	Color of the gauge	A. Choose the theme color for the chosen gauge. This might include: Filled color (semidonut, donut, and linear) - Shade for the progress arc Non filled color (semidonut, donut, and linear) -  Shade for the remaining arc Target marker color (semidonut and linear) - Shade for the goal indicator Needle color (semidonut) - Shade for the dynamic display data's indicator Ranges (range gauge) - Shades for the different ranges configured for the gauge. B. Customize the background color of the gauge. Note: The color options vary from preset colors, the theme color of the application to match overall branding, and custom colors chosen through a color picker.
	Font family	Choose a font for the statistics displayed on the gauge.
Value Target Minimum/Maximum (The properties can be configured uniquely for each of the above data)	Style	Customize the style properties of the data on the gauge such as emboldening and italicizing it.
	Color	Click the A icon and select a font color for the gauge data.
	Font size	Click the dropdown to pick a preset font size for the gauge data, from the options 12 - 40 px. Click on the numeric value to set a custom value anywhere between 1 and 99 pixels.

2. Managing gauges

From within the gauge builder:

Apart from building the gauge, you can perform the following actions:

1. Add Element Name - Click the pencil () icon in the top right corner of the Gauge Configuration pane to edit the element's name. This name can be used to locate the specific element in the page builder among others.
2. Click the Gauge types arrow () and choose another gauge to change it after the configuration is complete. The configurations are retained when the gauge type is switched.
   

Once you're done configuring the gauge, click the () icon to navigate back to the page builder. You can further manage the gauge from there, such as relocating its position on the page, giving it a live mode title, and more.

From the edit mode of a page:

Click on a gauge to perform the actions mentioned below.

 

1. Adding a gauge title - Click the T icon to give a title for your gauge. This will appear as a heading above the gauge in the live mode of the application. Once inserted, click the gauge title to format it using the below options:
   
1. Font family - Choose from six different font types in the dropdown.
2. Font size - Choose a size from 12 - 40 px in the dropdown. The default value is 20px.
3. Bold - Click the B icon to embolden the title.
4. Font style - Click the I icon to italicize the title.
5. Font color - Click the A icon to choose a matching color for the gauge title.
6. Update title - Double click the inserted title to update it.
7. Remove title - Select the gauge and click the T icon again to remove it.
   
2. Deleting gauge - Click the bin icon to remove the gauge from the page.
3. Relocating gauges - Drag and drop a gauge elsewhere on the page builder to relocate it.
   

Edit or configure an existing gauge:

If you want to edit a previously inserted gauge, select the required gauge in the page builder and click Configure.

 

3. Related topics

1. Understanding gauges
2. Understanding pages