react-radial-progress-bar
v2.3.4
Published
This is a simple and stylable radial progress bar. It is entirely made on react. Light weight and fully optimised for current functionalities.
Downloads
8
Readme
react-radial-progress-bar
Radial Progress Bar
This is a simple and stylable radial progress bar. It is entirely made on react. Light weight and fully optimised for current functionalities.
Installation
Use the package manager npm to install react-radial-progress-bar.
npm install react-radial-progress-bar
Usage
import RPB from 'react-radial-progress-bar';
<RPB
size={120} // in px. default 120px
percentageCompleted={89} // current percentage filled in progress bar
fillColor={'blue'} // default #97a71d
backgroundColor={'#d6dadc'} /> // default #d6dadc
Use gradients to enhance the look of radial progress bar
import RPB from 'react-radial-progress-bar';
<RPB
size={120}
percentageCompleted={89}
fillColor={'linear-gradient(45deg, #E6465D, #F5A746)'}
backgroundColor={'white'} />
Animations on changing the percentageCompleted prop
Below is the demo