chart:gauge
Description
The chart gauge directive generates a gauge, you can also use the chart export and chart credit directives to add this functionality to your gauge.
Usage
as element:
<chart:gauge value="{number}" min="{number}" max="{number}" [stops="{array}"] [title="{string}"] value-suffix="{string}"> </chart:gauge>
Directive info
- This directive creates new scope.
Parameters
Param | Type | Details |
---|---|---|
value | number | Value to be displayed on the gauge. |
min | number | The smallest number that can be displayed on the gauge. |
max | number | The highest number that can be displayed on the gauge. |
stops (optional) | array | The colours to render at each stop measured from 0 to 1. Default [ [0.1, '#DF5353'], // red [0.5, '#DDDF0D'], // yellow [0.9, '#55BF3B'] // green ] |
title (optional) | string | The title of the chart. |
value-suffix | string | Suffix for the value on the gauge. |