InitiatePercentChart百分比图
InitiatePercentChart百分比图示例:
1、 定义前端HTML代码
<div style="width: 130px; height: 130px;" class="CenterDIV chartLineTime"> <div class="ct-chart chart-pie-left " style="position: relative;"> <div class="vertical-align text-center" style="height: 100%; width: 100%; position: absolute; left: 0; top: 0;"> <div class="font-size-20 vertical-align-middle" style="line-height: 1.1" id="项目完成率">20%</div> </div> </div> </div>
2、JavaScript实例化
InitiatePercentChart(container, Config)
container:要实例的元素,支持jquery css选择器多选几个元素,如:$(".chartLineTime")
Config:参数配置,相关属性如下:
donut: 是否显示外边线,true/false
donutWidth: 外边线的宽度,数值
startAngle: 起点的角度,0到360之间的数值
showLabel: 是否显示标签,true/false
width: 圆圈的宽度
height: 圆圈的高度
//显示图表 InitiatePercentChart($(".chartLineTime"), { donut: true, donutWidth: 3, startAngle: 0, showLabel: false, width: 130, height: 130 });