# Gauges
## This addon contains two gauge components: `{{linear-gauge}}` and `{{radial-gauge}}`. Both components take the following options:

* direction: The direction which the data is expected to go. This is related to the status of the gauge, and `amberLine` and `redLine`. Optional. Defaults to `asc`.
* amberLine: The threshold for changing the fill color to orange. Optional. No default. Must be less than `redLine` when `direction` is `asc` and greater than `redLine` when `direction` is `desc`.
* redLine: The threshold for changing the fill color to red. Optional. No default. Must be greater than `amberLine` when `direction` is `asc` and less than `amberLine` when `direction` is `desc`.
* val: The value to be shown by the component. Required.
* minVal: The lowest point on the gauge. Optional. Defaults to `0`.
* maxVal: The highest point on the gauge. Optional. Defaults to `100`.

Additionally, each component has the following unique options:

### `{{linear-gauge}}`
* showVal: Boolean to determine whether or not to show the numerical value of the progress bar. Optional. Defaults to `false`

### `{{radial-gauge}}`
* name: Adds a label above gauge describing what is being tracked. Optional. No default.
* unit: Adds a unit next to the val. Optional. No default.

```
#### Linear Gauge Usage
The Linear Gauge is purposefully minimal, only providing a container, fill, and optional value. It is likely that in a real-world scenario, this component will be paired with other components, such as a label or large value.
```handlebars
{{linear-gauge direction='asc' amberLine=50 redLine=75 val=25}}
```

```
#### Radial Gauge Usage
The Radial Gauge is more stylized and restrictive than the Linear Gauge. It is likely that in a real-world scenario, this component will be paired with other Radial Gauges.
```handlebars
{{radial-gauge direction='asc' amberLine=50 redLine=75 val=25 name='Speed' unit='mph'}}
```

##### TODO:
* [] - Add `size` property to `{{radial-gauge}}`.
* [] - Add `pegged` computed property to `{{radial-gauge}}` to indicate value is higher than `maxVal`.