{"id":13555169,"url":"https://github.com/qddegtya/v-circle","last_synced_at":"2025-04-13T08:23:18.892Z","repository":{"id":57389593,"uuid":"57094813","full_name":"qddegtya/v-circle","owner":"qddegtya","description":":doughnut: A collection of circle progress with Vue.js","archived":false,"fork":false,"pushed_at":"2023-02-14T03:08:40.000Z","size":19,"stargazers_count":107,"open_issues_count":3,"forks_count":30,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-27T00:11:10.290Z","etag":null,"topics":["javascript","vue"],"latest_commit_sha":null,"homepage":"http://xiaoa.name/v-circle/","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/qddegtya.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-04-26T03:28:50.000Z","updated_at":"2024-09-16T10:03:15.000Z","dependencies_parsed_at":"2024-06-19T14:58:12.718Z","dependency_job_id":"960af070-b0b0-4c60-a137-740301c1dbfd","html_url":"https://github.com/qddegtya/v-circle","commit_stats":{"total_commits":26,"total_committers":4,"mean_commits":6.5,"dds":"0.23076923076923073","last_synced_commit":"8374ca7250d8af051e9c2331abda8ba2d6902400"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qddegtya%2Fv-circle","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qddegtya%2Fv-circle/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qddegtya%2Fv-circle/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qddegtya%2Fv-circle/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/qddegtya","download_url":"https://codeload.github.com/qddegtya/v-circle/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248681832,"owners_count":21144758,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","vue"],"created_at":"2024-08-01T12:03:03.873Z","updated_at":"2025-04-13T08:23:18.860Z","avatar_url":"https://github.com/qddegtya.png","language":"Vue","funding_links":[],"categories":["Vue"],"sub_categories":[],"readme":"v-circle\n[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors)\n======\n\nA collection of circle progress with Vue.js.\n\n* Vue 1.0+ use `v-circle 0.1+`\n* Vue 2.0+ use `v-circle 0.2+`\n\n## Demos \u0026 Examples\n\nLive Demo: [xiaoa.name/v-circle](http://xiaoa.name/v-circle/)\n\nTo build the examples locally, run:\n\n```\nnpm install\nnpm run dev\n```\n\nThen open [http://localhost:8080/examples/home.html](http://localhost:8080/examples/home.html) in a browser.\n\n## Installation\n\nThe easiest way to use `v-circle` is to install it from NPM and include it in your own Vue build process (using [Webpack](http://webpack.github.io/), etc)\n\n```\n$ npm install v-circle\n```\n\n## Build\n\nbuild to dist\n\n```\n$ npm run build\n```\n\nYou can also use the standalone build by including `dist/v-circle.js` in your page. If you use this, make sure you have already included Vue, and it is available as a global variable.\n\n## Usage\n\n.vue file usage\n\n```\n\u003ctemplate\u003e\n\u003ccircle-css color=\"#3498db\" width=120 font-size=48 pv=12 bold=8 text-bg-color='#f0f0f0'\u003e\u003c/circle-css\u003e\n\u003c/template\u003e\n\n\u003cscript\u003e\nimport CssCircle from 'v-circle/components/css-circle.vue'\n\nexport default {\n  components: {\n    circleCss: CssCircle\n  }\n}\n\u003c/script\u003e\n```\n\n## Circles\n\n* CssCircles\n* SvgCircles\n* CanvasCircles\n\n## API\n\n### CssCircles\n\n| prop | type | description | example | default value |\n|:------------- |:--------------- |:------------- |:-------- |:-------- |\n| color | String | circle progress fill color | #000000 | #2ecc71 |\n| width | Number | circle size | 180 | 150 |\n| fontSize | Number | circle progress value size | 64 | 64 |\n| pv | Number | circle progress value | 75 | 0 |\n| textColor | String | circle progress value color | #bdc3c7 | #bdc3c7 |\n| bold | String | circle progress outline width | 10 | 5 |\n| textBgColor | String | circle progress value background-color | #000000 | #f9f9f9 |\n| borderColor | String | circle progress outline color | #000000 | #bdc3c7 |\n| during | Number | circle progress animation dur-time | 2 | 0.8 |\n| bgColor | String | circle progress background-color | #000000 | #f0f0f0 |\n\n## Contributors\n\nThanks goes to these wonderful people ([emoji key](https://github.com/all-contributors/all-contributors#emoji-key)):\n\n\u003c!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section --\u003e\n\u003c!-- prettier-ignore --\u003e\n| [\u003cimg src=\"https://avatars2.githubusercontent.com/u/773248?v=4\" width=\"100px;\" alt=\"Archer (炽宇)\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eArcher (炽宇)\u003c/b\u003e\u003c/sub\u003e](http://xiaoa.name)\u003cbr /\u003e[💻](https://github.com/qddegtya/v-circle/commits?author=qddegtya \"Code\") [🚇](#infra-qddegtya \"Infrastructure (Hosting, Build-Tools, etc)\") [🚧](#maintenance-qddegtya \"Maintenance\") |\n| :---: |\n\u003c!-- ALL-CONTRIBUTORS-LIST:END --\u003e\n\nThis project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fqddegtya%2Fv-circle","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fqddegtya%2Fv-circle","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fqddegtya%2Fv-circle/lists"}