desenha Quadrado, perguntando variáveis com prompt:

Agora usei a função desenhaQuadrado e fixei alguns valores e criei uma função desenha fração que pergunta qual o valor do denominador e do numerador da fração a se criar. o que acham?

<meta charset="utf-8">

<canvas width="1200" height="800"></canvas>


<script>

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

    function desenhaTexto(texto, x , y) {

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

        pincel.font='40px Georgia';
        pincel.fillStyle='black';
        pincel.fillText(texto, x, y);    

    }



    function desenhaQuadrado(x,y,tamanho,cor,corBorda) {

        pincel.fillStyle = cor;
        pincel.fillRect(x,y,tamanho,tamanho);
        pincel.strokeStyle = 'corBorda';
        pincel.strokeRect(x,y,tamanho,tamanho);

    }


    function desenhaFracao(num,denom) {

    desenhaTexto("Qual é a fração?", 150, 50);


        var inicioX = 200;
        var inicioY = 200;
        var tamanho = 50
        var largura = 0;

        for(var i = 0; i < numerador; i++) {

            eixoX = inicioX + largura;
            desenhaQuadrado(eixoX, inicioY, tamanho, "green", "black");
            largura = largura + tamanho;
        }

        for(var c = 0; c < (denominador - numerador); c++) {
            eixoX = inicioX + largura;
            desenhaQuadrado(eixoX, inicioY, tamanho, "white", "black");
            largura = largura + tamanho;

        }



    }



    denominador = parseInt(prompt("QUAL O DENOMINADOR DA FRAÇÃO A SER CRIADA?(TOTAL DE QUADRADOR PREENCHIDOS OU NÃO)"));
    numerador = parseInt(prompt("QUAL O NUMERADOR DA FRAÇÃO? ( TOTAL DE QUADRADOS PREENCHIDOS)"));

    desenhaFracao(numerador,denominador);





</script>

Oi, Ricardo! Tudo bem?

Bacana demais sua solução, parabéns.

Qualquer dúvida estamos à disposição.

Continue praticando e bons estudos!

Até mais!