vue-circleprogressbar

• 一个简略的环形进度条组件

最近在开发可视化大屏我的项目中常常会用到环形进度条,然而罕用的echarts组件对环形进度条的反对不太好,写起来比拟麻烦.就想着本人写一个VUE的环形组件,满足本人日常开发需要;

2021/07/26更新内容:

• 闲来无事对组件进行文件压缩,减小援用体积

2019/12/21更新内容:

• 欠缺bar的宽度逻辑,bar的宽度依据父容器的宽度进行自适应,可自定义widthPresent设置bar占父容器宽-- 度的比例;
• 增加渐变色gradientsColor
• 去掉lodash的依赖,减小组件大小
• 解决bar不随progress变动的bug

vue-circleprogressbar

• 一个简略的环形进度条组件

  先上效果图
  

Installation

$ npm install vue-circleprogressbar

Usage

<template>    <div class="wrap_01" style="height: 300px;">        <CircleProgress            :id="id"          :width="300"          :radius="20"          :progress="30"          :isAnimation="true"        ></CircleProgress>    </div></template><script>import CircleProgress  from 'vur-circleprogressbar';export default {  data() {    return {};  },  components: {    CircleProgress  }};</script>

Optiosn

slot