VUE Ring-Progress ---- 圓環進度條 組件

VUE Ring-Progress ---- 圓環進度條 組件

usage：
一、在main.js內
 
  import RingProgress from './components/Ring-Progress.vue'
  
  Vue.component(RingProgress.name, RingProgress)
  
二、
  <Ring-Progress :widthRem="4"
                    :fontSize0Rem="0.48"
                    :fontSize1Rem="0.32"
                    :radius="4"
                    :progressData = "{progressNum: 88.88, canvasId: 'top1'}" />
  
  props: {
    widthRem:  // canvas寬度
    fontSize0Rem： // 圓環內字體大小
    fontSize1Rem： // 圓環內字體大小
    radius： // 圓環弧度
    progressData： {
      progressNum： '當前進度'，
      canvasId： '' // canvasID
    }
  }  
注：HTML根元素未設置font-size時，默認爲37.5px

 

點我，GitHub地址~~~~~