FTT-JavaScript/aulajs30.html at master · luizgustavo77/FTT-JavaScript · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!DOCTYPE html>
<html>
    <head>
    <title>JavaScript Aula 30</title>
    <script>
        function getRandomColor() {
            var letters = '0123456789ABCDEF';
            var color = '#';
            for (var i = 0; i < 6; i++) {
                color += letters[Math.floor(Math.random() * 16)];
            }
            return color;
        }

        function canvasDraw() {
            var c = document.getElementById("theCanvas");
            var ctx = c.getContext("2d");
            ctx.moveTo(0, 0);
            ctx.strokeStyle = getRandomColor();

            for (i = 0; i < 100; i++) {

                ctx.lineTo(Math.floor(Math.random() * 800), Math.floor(Math.random() * 600));

            }

            ctx.stroke();
        }
    </script>
</head>

<body onload="canvasDraw();">
    <h1>JavaScript Aula 30</h1>
    <h2>Canvas</h2>
    <canvas id="theCanvas" width="800" height="600" style="border:1px solid black;">
        Your browser does not support the HTML5 canvas tag.</canvas>


</body>
</html>