微信小程序转盘抽奖积分


    // 绘制转盘

    drawPrizes() {

        let prizes = this.data.prizes

        wx.getSystemInfo({

            success: function (res) {

                let f = res.windowWidth / 750 * 32

                let r = res.windowWidth / 750 * 530 / 2

                let canvas = wx.createCanvasContext('prizes')

                prizes.forEach((item, index) => {

                    canvas.save()

                    canvas.translate(r, r);

                    canvas.rotate(index * 36 * Math.PI / 180);

                    canvas.translate(-r, -r);

                    canvas.beginPath()

                    canvas.moveTo(r, r)

                    canvas.arc(r, r, r, -108 * Math.PI / 180, -72 * Math.PI / 180, false)

                    canvas.fillStyle = index % 2 ? '#FFAC3A' : '#FFFEEE'

                    canvas.closePath();

                    canvas.fill();

                    canvas.beginPath()

                    canvas.fillStyle = '#333'

                    canvas.textAlign = 'center';

                    canvas.setFontSize(f)

                    let txt1 = item.name.substring(0, 4)

                    let txt2 = item.name.substring(4).substring(0, 4)

                    canvas.fillText(txt1, r, r / 5)

                    canvas.fillText(txt2, r, r / 5 + f)

                    canvas.closePath()

                    canvas.fill()

                    canvas.restore();

                })

                canvas.draw()

            }

        })

    },

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。