Canvas должен работать как движение устройства на мобильном телефоне - PullRequest
0 голосов
/ 13 марта 2020

Это изображение Бриджит Рилли полос в коробке, полосы отсортированы по разным цветам. Я хочу использовать движение устройства, чтобы запустить этот код на моем телефоне, независимо от того, что я пытаюсь, у меня не получится, если кто-нибудь сможет мне помочь

var c = document.getElementById("c");
        var ctx = c.getContext("2d");
    
        var colors = ["#6495ED", "#6495ED","#FFA500", "#6495ED", "#CD5C5C", "black", "#6495ED", "#CD5C5C", "#6495ED","#FFA500","#6495ED","white","#6495ED","#FF0000","#6495ED","#FF0000","#FFA500","#FF4500","#6495ED"];
        var stripes = 100;
        
        for(var i = 0; i < stripes; i++) {
            var d = 375 / stripes;
            ctx.beginPath();
            ctx.strokeStyle = colors[i % colors.length];
            ctx.lineWidth = d;
            ctx.moveTo(i*d + d/2, 0);
            ctx.lineTo(i*d + d/2, 450);
            ctx.stroke();
        }
<!DOCTYPE html>
    <html>
    <body>
        <canvas id="myCanvas"></canvas>
    
    <canvas id="c" width="375" height="450" style="border:1px solid #d3d3d3;">
    Your browser does not support the HTML5 canvas tag.</canvas>
    <div class = "ver">
    

    </body>
    </html>
...