大转盘抽奖小程序版转盘抽奖网页版

//转盘内部绘制
lottery.prototype.getCanvasI=function(){
 let itemsArc=360/this.itemsNum //获取大转盘每等分的角度
 this.itemsArc=itemsArc
 let widthI=canvasI.width
 let heightI=canvasI.height
 this.w1=parseInt(widthI/2)
 this.h1=parseInt(heightI/2)
 this.Items(itemsArc)//每一份扇形的内部绘制
 this.mytime=setInterval(this.light.bind(this),1000)
}
//绘制奖品名称
lottery.prototype.Items=function(e){
 let that=this
 let itemsArc=e//每一分扇形的角度
 let Num=that.itemsNum// 等分数量
 let text=that.text// 放文字的数组
 for(let i=0;i=2){
  that.lamp=0
 }
 ctx2.beginPath()
 ctx2.arc(that.w2,that.h2,that.w2,0,2*Math.PI)//绘制底色为红色的圆形
 ctx2.fill;
 ctx2.fill()
 for(let i=0;i

//事件处理函数
 onLoad: function (e) {
  let that=this
  let itemsArc=360/that.data.itemsNum //获取大转盘每等分的角度
  that.setData({
   itemsArc
  },function () {
   wx.createSelectorQuery().select('#canvas-one').boundingClientRect(function (rect) {
    w1=parseInt(rect.width/2)
    h1=parseInt(rect.height/2)
    that.Items(itemsArc)//每一份扇形的内部绘制
   }).exec()
   mytime=setInterval(that.light,1000)//启动跑马灯定时器
  })
 },
 onReady:function () {
  var that=this
  wx.createSelectorQuery().select('#canvas-bg').boundingClientRect(function (rect) {//监听canvas的宽高
   w2=parseInt(rect.width/2)
   h2=parseInt(rect.height/2)
   that.light()
  }).exec()
 },
 light(){//跑马灯绘制
  let that=this
  let itemsNum=that.data.itemsNum
  lamp++
  if(lamp>=2){
   lamp=0
  }
  ctx2.beginPath()
  ctx2.arc(w2,h2,w2,0,2*Math.PI)//绘制底色为红色的圆形
  ctx2.setFillStyle("#FA7471")
  ctx2.fill()
  for(let i=0;i