draw animated circular progress bar
参数名 | 参数说明 | 举例 |
---|---|---|
colorArr | 颜色值必须是两个,可以为相同颜色,也可以是渐变的两个色值 | ["#ffe000","#ff4f00"] |
colorBg | 半圆背景色 默认#ffffff | 'transparent' |
linewidth | 最外容器的宽度 | 30 |
r | 进度条的半径 | 120 |
startPoint | 开始角度,开始角度不同,半圆的大小不同,默认为 Math.PI*0.7 | Math.PI*0.8 |
targetPersent | 进度(0-1) | 0.9 |
point | 进度条末端的点 |
|
######动画开始 #####execAnimation()
var instance = new percentCircle("myCanvas",{
colorArr:["#ffe000","#ff4f00"], //颜色值必须是两个,可以为相同颜色,也可以是渐变的两个色值
colorBg:'transparent', //半圆背景色 默认#ffffff
linewidth:30, //半圆的宽度
r:120,
startPoint:Math.PI*0.8, //开始角度,开始角度不同,半圆的大小不同,默认为 Math.PI*0.7;
targetPersent:1, //进度(0-1)
point:{ //进度条末端的点
show:true, //是否显示
color:'#ffffff' //颜色
}
});
instance.execAnimation(); //动画开始