掘金抽奖，不中大奖，自己复原UI, 中大奖，顺便封装一个库，不问格子数，自定义起始位置，支持多个格子同一礼物，一起来学习吧。

前言  之前的文章有写过九宫格抽奖功能【 Vue3实现九宫格抽奖功能 】， 有兴趣的可以看一看给个赞啥的，今天我们看看如何实现一个转盘抽奖功能。  之前公司也写过转盘抽奖功能，实现流程大概是设计师出个

前言 “运营三宝”（九宫格、大转盘、老虎机，当然次三宝当然是最基础的营销运营手段），本片文章聊聊大转盘，转盘的实现逻辑应该是营销方案较为简单的一种了；

呀呀呀，感觉好久没有更新文章了，闲暇之余，复盘了一下主流的抽奖效果实现，并且封装了一个工具类便于后期使用，这里借此机会分享给大家。

代码地址 前言 这个组件是我写过的关于移动端h5活动转盘抽奖的页面，当时写完之后确定挺好看、挺炫的，所以就把它单独出来了，以后再写类似的页面，可以参考其中的一些实现原理！ 主要用到的技术 用Math.random()方法实现一个区间的随机数，用于实现每次用户点击抽奖的时候，随机…

定义点击事件，当点击旋转按钮，执行rotateWheel() 方法，该方法将动态改变全局变量 starRadian的值，并调用 window.requestAnimationFrame()方法实现逐帧旋转动画。 之所以在绘制最开始对画布做清理，是为了完成逐帧动画。 我们可以想象…