circles

circles是一款基于HTML5 SVG的轻量级JavaScript圆形进度条插件。该圆形进度条具有响应式，可动画等特点，并且可以制作出圆形进度条进入视口才开始动画的效果。

使用

在HTML文件中包含circles.js或circles.min.js文件。没有依赖关系。

在HTML中创建一个占位符div：

<div class="circle" id="circles-1"></div>

通过调用创建图形，id应匹配占位符的id <div>：  

var myCircle = Circles.create({
  id:                  'circles-1',
  radius:              60,
  value:               43,
  maxValue:            100,
  width:               10,
  text:                function(value){return value + '%';},
  colors:              ['#D3B6C6', '#4B253A'],
  duration:            400,
  wrpClass:            'circles-wrp',
  textClass:           'circles-text',
  valueStrokeClass:    'circles-valueStroke',
  maxValueStrokeClass: 'circles-maxValueStroke',
  styleWrapper:        true,
  styleText:           true
});

仅供个人学习参考/导航指引使用，具体请以第三方网站说明为准，本站不提供任何专业建议。如果地址失效或描述有误，请联系站长反馈～感谢您的理解与支持！

链接: https://web.fly63.com/nav/2635