https://github.com/pguso/js-plugin-circliful
javascript circle statistic plugin
https://github.com/pguso/js-plugin-circliful
Last synced: 7 months ago
JSON representation
javascript circle statistic plugin
- Host: GitHub
- URL: https://github.com/pguso/js-plugin-circliful
- Owner: pguso
- License: mit
- Created: 2014-01-03T16:45:01.000Z (over 12 years ago)
- Default Branch: master
- Last Pushed: 2023-04-15T16:54:08.000Z (over 3 years ago)
- Last Synced: 2025-05-05T19:15:46.183Z (about 1 year ago)
- Language: TypeScript
- Homepage: https://stackblitz.com/edit/js-2m2bs7
- Size: 2.42 MB
- Stars: 887
- Watchers: 49
- Forks: 307
- Open Issues: 20
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Circle Statistics #
Test it https://stackblitz.com/edit/js-2m2bs7
New implementation of circliful, without any dependencies - dependencies are only used for development like webpack, jest, typescript, tslint and babel.
* show Infos as Circle Statistics, no images used
* based on SVG
* many options can be set
* fully responsive
## How to use circliful
Include circliful to your Site via script tag. If you want to use font-awesome icons you need to include the files separately.
Github clone / download
```
circliful.newCircle({
percent: 50,
id: 'circle',
type: 'simple',
});
```
npm package
```
npm i js-plugin-circliful
```
```javascript
import {circliful} from 'js-plugin-circliful';
circliful.newCircle({
percent: 50,
id: 'circle',
type: 'simple',
});
```
```css
@import 'js-plugin-circliful/dist/main.css';
```
```html
```
## Documentation
* [Api](./docs/api.md)
* [Create custom circle](./docs/create-new-circle.md)
* [Setup dev enviroment (with webpack)](./docs/dev-environment.md)
* [List of available options](./docs/options.md)
* [Style your cirles via css](./docs/style-elements.md)
If you feel there is something missing in the documentation or the library please open a issue.
Donation
--------
If you find this plugin useful or/and use it commercially feel free to donate me a cup of coffee :)
[](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=D3F2MMNDHQ9KQ)