# Gauge

## 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:

![](/files/GIxSZ0FTBaI7zRMMNcm8)

### **Properties of the Gauge component:**

* **Background:**&#x20;
  * The user can enable border, change the border color, and border-radius.&#x20;
  * The user can enable the shadow, change the shadow color, and transparency of the shadow.&#x20;
  * If the user gives 2 or more colors in the gradient its position can be adjusted by Gradient Rotation.

#### **General:**&#x20;

* The user can change the height, width, top, left values.&#x20;
* 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.&#x20;
* &#x20;If the user enables the ticks, then the user can see marker lines on the gauge.&#x20;
* 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.

![](/files/zZgCftKR7joS9Rfqmibr)

{% hint style="info" %} <mark style="color:green;">Please Note:</mark> The chart will not be visible at the first preview if the initial visibility is unchecked.
{% endhint %}

#### **Indicators:**&#x20;

* Colors for the range can be specified under the range section.&#x20;
* Also, what is the current value of the gauge and the target can be specified under the ***Value Variable*** and ***Target Value***.&#x20;
* Also, the minimum and maximum range can be set.

![](/files/mJeR0dx4ldVJpphfw9mF)

#### **Style:**&#x20;

* The ***Bezel color*** can be changed to adjust the gauge border color.&#x20;
* The selected ***Face colo*****r** will be the **Gauge Fill** color.&#x20;
* The Tick Color changes the color of ticks/markers between ranges.&#x20;
* The ***Pointer Color*** is changed for adjusting the tick pointer color.&#x20;
* Also, the user can change the **label font color**, **title font color**, **font family**, and **font size** under this section.

![](/files/DME5BMMUGVdfCT6cLLbx)

#### Formatter:

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

![](/files/avBhvIbMGJZ0dX7fi9qe)

#### Modified Gauge by changing the properties:

![](/files/tFjIRO52p0jY4eJFudY3)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.bdb.ai/bdb-documentation/data-visualization/governed-dashboards/charts-gallery/other-charts/gauge.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
