Gauge

The gauge component is used to show the progress towards a goal. The set Target gets marked and the pointer displays our progress.

Default Chart Image:​

​

Properties of the Gauge component:

• Background:

  • The user can enable border, change the border color, and border-radius.

  • The user can enable the shadow, change the shadow color, and transparency of the shadow.

  • If the user gives 2 or more colors in the gradient its position can be adjusted by Gradient Rotation.

General:

• The user can change the height, width, top, left values.

• Put a checkmark in given box to select Initial Visibility option. If this option is enabled, then the chart appears in the first preview of the dashboard.

• If the user enables the ticks, then the user can see marker lines on the gauge.

• Use a checkmark in the given box to show the Range.

• If the user enables the show title option and gives some units in the Title section it will get displayed inside the gauge at the top position.

​​

Please Note: The chart will not be visible at the first preview if the initial visibility is unchecked.

Indicators:

• Colors for the range can be specified under the range section.

• Also, what is the current value of the gauge and the target can be specified under the Value Variable and Target Value.

• Also, the minimum and maximum range can be set.

Style:

• The Bezel color can be changed to adjust the gauge border color.

• The selected Face color will be the Gauge Fill color.

• The Tick Color changes the color of ticks/markers between ranges.

• The Pointer Color is changed for adjusting the tick pointer color.

• Also, the user can change the label font color, title font color, font family, and font size under this section.

​​

Formatter:

• This properties section helps to provide format for the monetary data.

​​

Modified Gauge by changing the properties:

​​