53_bandeira_brasil.html

<!-- bandeira-brasil.html -->
<canvas width="600" height="400"></canvas>

<script>

    var canvas = document.querySelector('canvas');
    var brush = canvas.getContext('2d');

    //fundo bandeira
    brush.fillStyle='green';
    brush.fillRect(0,0,600,400);

    //primeiro triangulo
    brush.fillStyle='yellow';
    brush.beginPath();
    brush.moveTo(300,50);
    brush.lineTo(50,200);
    brush.lineTo(550,200);
    brush.fill();

    //segundo triangulo
    brush.beginPath();
    brush.moveTo(300,350);
    brush.lineTo(50,200);
    brush.lineTo(550,200);
    brush.fill();

    //circulo
    brush.fillStyle='darkblue';
    brush.beginPath();

    brush.arc(300, 200, 100, 0, 2*314);
    brush.fill();

</script>