JavaScript-Canvas zum Erstellen eines Rubbellos-Beispiels

<div Klasse="ggk">
        <span id="span">200 Yuan</span>
        <Leinwand-ID="Leinwand"></Leinwand>
</div>

.ggk {
            Breite: 200px;
            Höhe: 100px;
            Rand: 1px durchgezogen #000;
            Rand: 20px automatisch;
            Farbe: rot;
            Position: relativ;
        }
 
        .ggk Spanne {
            Position: absolut;
            Breite: 100 %;
            Höhe: 100%;
            Textausrichtung: zentriert;
            Schriftgröße: 50px;
            Zeilenhöhe: 100px;
        }
 
        #Leinwand {
            Position: absolut;
            links: 0;
            oben: 0;
        }

var Leinwand = document.getElementById("Leinwand")
        init()
        Funktion init() {
            Leinwandbreite = 200;
            Leinwand.Höhe = 100;
            var ctx = canvas.getContext("2d")
            // Mit einer Schicht Grau bedecken ctx.save();
            ctx.fillStyle = "rgb(100,100,100)"
            ctx.fillRect(0, 0, 200, 100)
            zeichnen(ctx)
            pro()
        }
 
        // Zufälliger Inhalt Funktion pro() {
            var span = document.getElementById("span")
            var arr = ["100 Yuan", ‚Danke für Ihre Schirmherrschaft‘, ‚200 Yuan‘, ‚Danke für Ihre Schirmherrschaft‘, ‚Danke für Ihre Schirmherrschaft‘, ‚Danke für Ihre Schirmherrschaft‘, ‚5 Millionen‘, ‚Danke für Ihre Schirmherrschaft‘]
            var num = Math.floor(Math.random() * (arr.length - 1))
            var text = arr[num]
            span.innerHTML = Text
        }
 
        Funktion zeichnen(ctx){
            //Klick-Ereignis canvas.onmousedown = function(e){
                //Ereignis verschieben var downX = e.offsetX
                var downY = e.offsetY
                ctx.beginPath()
                // ctx.globalCompositeOperation = "Ziel-Ausgang"
                ctx.Linienbreite = 10;
                ctx.moveTo(nach untenX,nach untenY)
 
                canvas.onmousemove = Funktion(e){
                    var x = e.offsetX
                    var y = e.offsetY
                    // ctx.lineTo(x,y)
                    ctx.clearRect(x,y,20,20)
                    ctx.stroke()
 
                }
            }
            // Maus-Popup-Ereignis canvas.onmouseup = function(){
                canvas.onmousemove = null
            }
        }