Progress Bar.
http://react-component.github.io/progress/
- support IE9+, Chrome, Firefox, Safari
import { Line, Circle } from 'rc-progress';
ReactDOM.render(<div>
<Line percent="10" strokeWidth="4" strokeColor="#D3D3D3" />
<Circle percent="10" strokeWidth="4" strokeColor="#D3D3D3" />
</div>, container);
name | type | default | description |
---|---|---|---|
strokeWidth | Number | 1 | Width of the stroke. Unit is percentage of SVG canvas size. |
strokeColor | String | #2db7f5 | Stroke color. |
trailWidth | Number | 1 | Width of the trail stroke. Unit is percentage of SVG canvas size. Trail is always centered relative to actual progress path. If trailWidth are not defined, it same as strokeWidth. |
trailColor | String | #D9D9D9 | Color for lighter trail stroke underneath the actual progress path. |
strokeLinecap | String | round | The shape to be used at the end of the progress bar, can be square or round. |
prefixCls | String | rc-progress | prefix className for component |
className | String | customized className | |
style | Object | style object will be added to svg element |
npm install --save rc-progress
npm install
npm start
rc-progress is released under the MIT license.