Gathering detailed insights and metrics for vue-circle-xprogress
Gathering detailed insights and metrics for vue-circle-xprogress
Installations
npm install vue-circle-xprogressDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Min. Node Version
>= 6.0.0
Node Version
9.2.1
NPM Version
6.4.1
Releases
Unable to fetch releases
Languages
1
Vue
Vue (100%)
Developer
anthinkingcoder
Download Statistics
Total Downloads
1,552
Last Day
1
Last Week
3
Last Month
23
Last Year
165
GitHub Statistics
5 Commits
1 Watchers
1 Branches
1 Contributors
Updated on Sep 11, 2018
Maintainers
1
Package Meta Information
Latest Version
0.0.3
Package Id
vue-circle-xprogress@0.0.3
Unpacked Size
30.02 kB
Size
7.40 kB
File Count
8
NPM Version
6.4.1
Node Version
9.2.1
Total Downloads
Cumulative downloads
Total Downloads
1,552
Last Day
0%
1
Compared to previous day
Last Week
50%
3
Compared to previous week
Last Month
43.8%
23
Compared to previous month
Last Year
32%
165
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dev Dependencies
31
autoprefixerautoprefixer-loaderbabel-corebabel-helper-vue-jsx-merge-propsbabel-loaderbabel-plugin-syntax-jsxbabel-plugin-transform-runtimebabel-plugin-transform-vue-jsxbabel-preset-envbabel-preset-stage-2css-loaderfile-loaderfriendly-errors-webpack-pluginmini-css-extract-pluginnode-sassoptimize-css-assets-webpack-pluginpostcsspostcss-importpostcss-loaderpostcss-urlsasssass-loaderstyle-loadervuevue-loadervue-style-loadervue-template-compilerwebpackwebpack-bundle-analyzerwebpack-cliwebpack-merge
vue-circle-progress
a vue component of circle progress bar
install
1$ npm i vue-circle-xprogress -s
use npm
1 import Vue from 'Vue' 2 import CircleProgress from 'vue-circle-xprogress' 3 import 'vue-circle-progress/dist/circle-progress.css' 4 Vue.use(CircleProgress)
use cdn
1<script src="https://cdn.jsdelivr.net/npm/vue-circle-xprogress@0.0.1/dist/circle-progress.min.js"></script> 2<link ref="stylesheet" href="https://cdn.jsdelivr.net/npm/vue-circle-xprogress@0.0.1/dist/circle-progress.css">
live example
start
1<template> 2 <circle-progress percent="30" size="60"> 3 <p>30</p> 4 </circle-progress> 5</template> 6<script> 7</script>
circle-progress Component
props
| param | description | type | default |
|---|---|---|---|
| percent | 进度百分比 0-100 | Number | 0 |
| size | 大小 | Number | 120 |
| staticWidth | 背景圆环 stroke 宽度 | String | 6 |
| staticColor | 背景圆环 颜色 | String | #E8EAED |
| dynamicWidth | 圆环 stroke 宽度 | Number | 7 |
| dynamicColor | 圆环 颜色 | String | #3864EC |
| dynamicShape | 圆环边角形状 round,square | String | round |
| dashboard | 仪表盘 | Boolean | false |
No vulnerabilities found.