使用HTML5制作加载图的一个例子

本文主要介绍使用HTML5制作加载图的例子，需要的朋友可以参考一下。






复制代码代码如下所示：








var加载=函数（画布，选项）{
this.canvas = document.getelementbyid（帆布）；
this.options =选项；
}；
loading.prototype = { {
构造函数：加载，
显示：函数（）{
VaR的画布this.canvas，
开始= this.options.begin，
老= this.options.old，
this.options.linewidth线宽=，
canvascenter = { x：canvas.width / 2，Y：canvas.height / 2 }，
CTX = canvas.getcontext（2D），
颜色= this.options.color，
Num = this.options.num，
角度= 0，
线帽= this.options.linecap，
const_pi = math.pi *（360 /努姆） / 180；
window.timer = setInterval（）{（）函数（
ctx.clearrect（0, 0，canvas.width，帆布，高度）；
对于（var i = 0；i <数字；i = 1）{
Ctx.beginPath（）；
ctx.strokestyle =色{民- 1 -我}；
ctx.linewidth =线宽；
CTX线帽，线帽；
Ctx.moveTo（canvascenter。x + math.cos（const_pi *我+角）*开始，canvascenter。Y + math.sin（const_pi *我+角）*）；
Ctx.lineTo（canvascenter。x + math.cos（const_pi *我+角）*岁，canvascenter。Y + math.sin（const_pi *我+角）*）；
Ctx.stroke（）；
Ctx.closePath（）；
}
const_pi角=；
console.log（角度）
}，50）；
}，
隐藏：函数（）{
ClearInterval（窗口。定时器）；
}
}；
（函数（）{（））
var选项{ {
Num：8，
开始：20，
老：40，
LineWidth：10，
线帽：圆
颜色：RGB（0, 0, 0）
}；
var加载=新加载（）画布
Loading.show（）；
}（）；





设计素描 uff1a