1.0.3 • Published 6 years ago
circle-process-bar v1.0.3
circle-process-bar
circle-process-bar is a kind of lightweight javacript library about creating custom circle-process-bar.
DEMO
https://ruichengping.github.io/circle-process-bar/site/
Dependencies
- jquery
Attentions： circle-process-bar does not import jquery,you should import jquery by yourself
INSTALL
npm i circle-process-bar --saveHOW TO USE
Execute circleProcessBar,you will get a html string about circle-process-bar.
import CircleProcessBar from 'circle-process-bar';
// return an html fragment code
CircleProcessBar({
percent: 0.7
...
});
PARAMETER INSTRUCTIONS
| PARAMETER | NEED | TYPE | DEFAULT | INSTRUCTIONS |
|---|---|---|---|---|
| percent | YES | Number | 0 | the process of circle-process-bar ，RANGE:0~1 |
| width | NO | Number | 100 | the diameter of circle-process-bar，UNIT：px |
| strokeWidth | NO | Number | 6 | the width of line，UNIT：px |
| strokeColor | NO | String | #52c41a | line color |
| bgColor | NO | String | #f8f8f8 | background color |
| fontColor | NO | String | #999 | text color |
| fontSize | NO | String | 14px | text fontsize |
| format | NO | Function | built-in functions | custom function for formating text |
| footer | NO | Function | built-in functions | custom function for extensions in footer |