https://github.com/lukem512/react-svg-partial-fill
React component that fills an SVG shape by a specified amount
https://github.com/lukem512/react-svg-partial-fill
progress-bar rating-stars react svg
Last synced: 7 months ago
JSON representation
React component that fills an SVG shape by a specified amount
- Host: GitHub
- URL: https://github.com/lukem512/react-svg-partial-fill
- Owner: lukem512
- Created: 2017-03-30T12:43:43.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2017-03-30T12:44:13.000Z (over 8 years ago)
- Last Synced: 2025-03-07T18:03:42.083Z (7 months ago)
- Topics: progress-bar, rating-stars, react, svg
- Language: JavaScript
- Size: 2.93 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# react-svg-partial-fill
React component that fills an SVG shape by a specified amount.
## Installation
```
npm install --save react-svg-partial-fill
```
## Usage
```js
const fs = require('fs')
const SvgPartialFill = require('react-svg-partial-fill')
const svgString = fs.readFileSync('./shape.svg', 'utf8')
// ...
render() {
return
}
```
The component accepts the following props:
* `width` - the display width
* `height` - the display height
* `background` - the background color of the
* `fill` - the color to fill the SVG with
* `percent` - the percentage to fill the shape
* `svg` - the contents of an SVG file as a `string`
* `style` - a JSX style object
## License
MIT © Luke Mitchell