Minha solução para a bandeira do Brasil

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

<script>

    //Função para desenhar poligonos
    function desenhaRect(cor, X, Y, comprimento, altura) {
        pincel.fillStyle = cor;
        pincel.fillRect(X,Y,comprimento,altura);
    }

    //Função para desenhar circunferências(círculos)
    function desenhaArc(cor, X, Y, raio,inicialAng,finalAng, def) {
        pincel.fillStyle = cor;
        pincel.beginPath();
        pincel.arc(X,Y,raio,inicialAng*3.14,finalAng*3.14,);
        pincel.fill();
    }

    //Variáveis para definir o Canvas
    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');
    pincel.fillStyle = 'green';
    pincel.fillRect(0,0,600,400);

    //Desenho da losângo
    pincel.fillStyle = 'yellow';
    pincel.beginPath();
    pincel.moveTo(300,0);
    pincel.lineTo(0,200);
    pincel.lineTo(300,400);
    pincel.lineTo(600,200);
    pincel.lineTo(300,0);
    pincel.fill();

    //Desenho do Circulo
    desenhaArc('blue',300, 200, 120, 0, 2,);

</script>