iot-app-kit icon indicating copy to clipboard operation
iot-app-kit copied to clipboard

[Gauge] Add threshold support to Gauge

Open corteggiano opened this issue 11 months ago • 0 comments

React-components Thresholds

thresholds can be represented in two ways:

  1. by just coloring the gauge
  2. by displaying a thinner outer line surrounding the gauge and coloring the gauge. example: image

in this example: there are 3 thresholds: A = threshold of < 400 and is green B = threshold of < 500 and is orange C = threshold of < 700 and is red

since the value of the gauge is 300 then threshold A is met and the gauge is colored green

please ignore adding the normal text since that is not supported by our threshold type definition

Dashboard Thresholds

Add ability to:

  • Create/Update/Delete thresholds
  • Change threshold colors
  • Change threshold styles between
    • show as outer ring
    • show as just color
### Acceptance criteria
- [ ] Thresholds can create an outer dial AND change color of gauge
- [ ] Thresholds dont create outer dial but change color of gauge
- [ ] Meeting a threshold changes the inner dial's color
- [ ] Users can add thresholds to 

corteggiano avatar Feb 29 '24 18:02 corteggiano