percentBar.js进度条

本框架为基于echarts制作了一个进度条插件,可以结合AXUI框架使用,基本用法如下:

当然用户可根据API制作更多效果,演示和参数如下:

参数汇总

名称 说明 类型 默认值
titleColor 头文字颜色 string #666666
startColor 进度条起点颜色 string #6619ff
endColor 进度条终点颜色 string #198cff
trackColor 轨道颜色 string #ebebeb
maxColor 极限文字颜色 string #666666
labelColor 指示文字颜色 string #198cff
fontSize 文字大小 number 14
labelFont 指示字体 string "Oswald Light","微软雅黑","microsoft yahei","Arial"(Oswald Light是本框架内置字体)
lineHeight 文字行高 number 28
formatter 指示文字格式,默认{c}{a}即是:数值+名称 function {c}{a}
name 进度条名称,本插件将name值用于formatter组合 string %
barWidth 进度条宽度 number 6
yData 头文字数组,格式:['','',''] array -
labelData 指示文字数组,格式:['','',''] array -
maxData 极限文字数组,格式:['','',''] array [100,100,100]
leftGap 左侧边距,默认值是四个字符的宽度+5px number 61
rightGap 右侧边距,默认值是三个字符的宽度 number 42
position 进度条相对文字的位置,默认是在下方bottom,可选top和middle string bottom
follow 进度条上是否显示指示标签,默认不显示 boolean false
Axui.cn 版权所有
技术QQ群:952502085 Github 码云
AXUI,面向设计,满足设计多样化需求的前端解决方案,减少或剔除JS文件资源和API