RadialMeter for Fender React UI Kit
Description
RadialMeter is used to display progress in a circle form.
Installation and Usage
yarn install @fenderdigital/react-radial-meter --save
import RadialMeter from '@fenderdigital/react-radial-meter';Props
-
size- width and height in pixels of the circle. -
circleColor- fill color of the circle -
progressColor- color of the progress meter -
strokeWidth- width of the progress meter ring -
percentCompleted- percentage completed in decimal. e.g. .8 (80%), .6 (60%), 1 (100%) -
centerIcon- icon name
| propName | propType | defaultValue | isRequired |
|---|---|---|---|
| size | number | 40 | - |
| circleColor | string | "#E6E6E6" | - |
| progressColor | string | "#2AC278" | - |
| strokeWidth | number | 4 | - |
| percentCompleted | number | .5 | - |
| centerIcon | string | "check" | - |
Development
Check the Monorepo README for development documentation.