NoRedInk/noredink-ui/34.3.1

NOTE: the latest version is 35.9.3

Nri.Ui.RingGauge.V1

A ring gauge made with svg that shows completion by stroking the circumference with a specific color.

Uses the strategy discussed here: https://medium.com/@heyoka/scratch-made-svg-donut-pie-charts-in-html5-2c587e935d72

view : Settings -> Svg

Shows a configurable SVG ring guage

type alias Settings =
{ backgroundColor : Color
, emptyColor : Color
, filledColor : Color
, percentage : Float
}
  • background color : the center of the ring's color
  • empty color: representation of the not-yet-done/unfilled part of the ring
  • filled color: representation of the done part of the ring
  • percentage: 0-100 value representing completion

Modules