Radial Gauge
Last updated
Last updated
The Radial Gauge in the KPI tool provides an intuitive way to visualize performance, progress, or targets using a circular scale. This highly customizable chart helps users effectively display key metrics with a sleek and modern design. Below is a detailed guide to its features and settings.
Here's a quick guide to create Radial Gauge in KPI:
Gauge Value
Gauge Value Mode: Displays the gauge value as a percentage (requires a gauge value field in percentage).
Actual-Target Mode: Displays actual and target values (requires both actual and target fields).
Actual Value Field (Only available in Actual-Target Mode)
Specify the field to represent the actual value.
Target Type (Only available in Actual-Target Mode)
From Data: Target values are derived from a field.
Fixed: A constant target value is used.
Target Field (Only available in Actual-Target Mode)
Choose the field representing the target value.
Max Value Type
None: No maximum is applied.
From Data: Maximum value is derived from a data field.
Fixed: Use a constant maximum value.
Display Type
Full Circle: Displays the gauge as a complete circle.
Half Circle: Displays the gauge as a semi-circle.
Arc: Displays the gauge as a partial arc.
Color with Conditional Formatting
Set the primary gauge color and apply conditional formatting dynamically based on data.
Remaining Arc Custom Color Toggle (On/Off)
Enable or disable custom coloring for the remaining portion of the arc.
Remaining Arc Color with Conditional Formatting
Define and dynamically style the color for the remaining arc based on data conditions.
Arc Options
Arc Inner Radius: Adjust the inner radius of the main arc.
Arc Outer Radius: Adjust the outer radius of the main arc.
Remaining Arc Inner Radius: Set the inner radius for the remaining arc.
Remaining Arc Outer Radius: Set the outer radius for the remaining arc.
Rounded Corner Checkbox: Enable rounded edges for the arc.
Show Tooltip Checkbox: Toggle tooltips on or off for the gauge.
Marker Labels
Label Size: Adjust the size of marker labels.
Label Color: Set the color for marker labels.
Target Labels
Label Size: Customize the size of target labels.
Label Color: Define the color for target labels.
Axis Ticks
Label Size: Adjust the font size for axis tick labels.
Label Color: Set the color for tick labels.
Tick Size: Define the size of tick marks.
Tick Color: Choose a color for tick marks.
Tick Width: Adjust the thickness of tick marks.
The Center Circle Tab allows you to add customizable content layers inside the radial gauge.
Add Layer Button
Content Type - Text
Text Input: Enter the text to display.
Font Family: Choose the font style for the text.
Styling (B/I/U): Apply bold, italic, or underline styling.
Font Size: Adjust the text size.
Font Color: Set the color of the text.
Alignment: Align the text (left, center, right).
Content Type - Icon
Icon Shape: Select an icon shape from the library.
Icon Size: Adjust the size of the icon.
Icon Color: Set the color of the icon.
Icon Alignment: Align the icon within the center circle.
Content Type - Measure Value - Percentage
Decimals: Set the number of decimal places.
+Format: Display positive values as 123 or +123.
-Format: Display negative values as -123 or (123).
Percentage Checkbox: Display the value as a percentage.
Font Family: Choose the font style.
Styling (B/I/U): Apply bold, italic, or underline styling.
Font Size: Adjust the size of the measure value text.
Font Color: Set the color of the measure value text.
Alignment: Align the measure value (left, center, right).
Content Type - Measure Value - Absolute
Prefix: Add a prefix to the measure value.
Suffix: Add a suffix to the measure value.
Decimals: Set the number of decimal places.
+Format: Display positive values as 123 or +123.
-Format: Display negative values as -123 or (123).
Percentage Checkbox: Display the value as a percentage.
Comma Checkbox: Add comma separators to the value.
Font Family: Choose the font style.
Styling (B/I/U): Apply bold, italic, or underline styling.
Font Size: Adjust the size of the measure value text.
Font Color: Set the color of the measure value text.
Alignment: Align the measure value (left, center, right).
Auto Fit Content Checkbox
Enable or disable automatic adjustment of content size based on the gauge dimensions.
This is common tab for all visuals click here to explore settings. You can adjust visual properties, manage formatting options, and fine-tune various features to align with your requirements. Make sure to explore each section for a complete configuration.