JavaScript canvas to achieve scratch lottery example

<div class="ggk">
        <span id="span">200 yuan</span>
        <canvas id="canvas"></canvas>
</div>

.ggk {
            width: 200px;
            height: 100px;
            border: 1px solid #000;
            margin: 20px auto;
            color: red;
            position: relative;
        }
 
        .ggk span {
            position: absolute;
            width: 100%;
            height: 100%;
            text-align: center;
            font-size: 50px;
            line-height: 100px;
        }
 
        #canvas {
            position: absolute;
            left: 0;
            top: 0;
        }

var canvas = document.getElementById("canvas")
        init()
        function init() {
            canvas.width = 200;
            canvas.height = 100;
            var ctx = canvas.getContext("2d")
            // Cover with a layer of gray ctx.save();
            ctx.fillStyle = 'rgb(100,100,100)'
            ctx.fillRect(0, 0, 200, 100)
            draw(ctx)
            pro()
        }
 
        // Random content function pro() {
            var span = document.getElementById("span")
            var arr = ["100 yuan", 'Thank you for your patronage', '200 yuan', 'Thank you for your patronage', 'Thank you for your patronage', 'Thank you for your patronage', '5 million', 'Thank you for your patronage']
            var num = Math.floor(Math.random() * (arr.length - 1))
            var text = arr[num]
            span.innerHTML = text
        }
 
        function draw(ctx){
            //Click event canvas.onmousedown = function(e){
                //Move event var downX = e.offsetX
                var downY = e.offsetY
                ctx.beginPath()
                // ctx.globalCompositeOperation = 'destination-out'
                ctx.lineWidth = 10;
                ctx.moveTo(downX,downY)
 
                canvas.onmousemove = function(e){
                    var x = e.offsetX
                    var y = e.offsetY
                    // ctx.lineTo(x,y)
                    ctx.clearRect(x,y,20,20)
                    ctx.stroke()
 
                }
            }
            // Mouse pop-up event canvas.onmouseup = function(){
                canvas.onmousemove = null
            }
        }