1
resposta

Desenhando com JavaScript

Bom dia Pessoal, Acabei e fazer o exercicio de desenho com o Javascript da bandeira do Brasil, e para treinar resolvi fazer a dos Estados Unidos, o problema é fazer as estrelas, alguém conhece alguma instrução que permita desenhar as estrelas dentro do retângulo azul. Abaixo segue o código, como as instruções estão muito repetidas, vou tentar fazer um código mais limpo usando while...

<meta charset="UTF-8" />
      <title>BANDEIRA DOS ESTADOS UNIDOS</title>
    </head>

<canvas width="600" height="400"></canvas>
<script>

    var tela = document.querySelector("canvas");
    var pincel = tela.getContext("2d");


    pincel.fillStyle = "white";
    pincel.fillRect(0, 0, 600, 360);

    pincel.fillStyle = "red";
    pincel.fillRect(0, 0, 600, 30);

    pincel.fillStyle = "red";
    pincel.fillRect(0, 60, 600, 30);

    pincel.fillStyle = "red";
    pincel.fillRect(0, 120, 600, 30);

    pincel.fillStyle = "red";
    pincel.fillRect(0, 180, 600, 30);

    pincel.fillStyle = "red";
    pincel.fillRect(0, 240, 600, 30);

    pincel.fillStyle = "red";
    pincel.fillRect(0, 300, 600, 30);

    pincel.fillStyle = "red";
    pincel.fillRect(0, 360, 600, 30);




    pincel.fillStyle = "darkblue";
    pincel.fillRect(0, 0, 220, 200);


</script>
1 resposta

Bom dia Antonio.

Gostei muito do código, também estou aprendendo, e tudo é novo para mim. Caso aplique o while, poste aqui também, por favor.

Acho bacana ler os códigos de outras pessoas, em relação as instruções repetidas, eu fiz um teste na bandeira do brasil, onde realizei apenas uma instrução de cor para os dois triângulos, no seu caso se aplicaria para todas as faixas vermelhas, realizando apenas uma instrução de cor.