Aproveitei do "for" para criar as frações de um jeito automático!

<meta charset="UTF-8">

<p>Qual é a fração?</p>
<canvas width="1024" height="400"></canvas>

<script>

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

    function desenhaQuadrado ( x, y, tamanho, cor, bol ) {
        if ( bol ) {
            pincel.strokeStyle = "black";
            pincel.strokeRect ( x, y, tamanho, tamanho );
        } else {
            pincel.fillStyle = cor;
            pincel.fillRect ( x, y, tamanho, tamanho );
        }
    }

    var tamanhoQuad = 75 // tamanho do quadrado

    var fracao1 = parseInt ( prompt ( "Informe o primeiro valor da fração!" ) );
    var fracao2 = parseInt ( prompt ( "Informe o segundo valor da fração!" ) );

    function calcularModulo ( ) {
        for (var x = 0; x < ( fracao1 * tamanhoQuad ); x = x + tamanhoQuad ) {
            desenhaQuadrado ( x, 0, tamanhoQuad, "green", false );
        }

        for (var s = 0; s < ( fracao2 * tamanhoQuad ); s = s + tamanhoQuad ) {
            desenhaQuadrado ( s, 0, tamanhoQuad, "green", true );
        }
    }

    function iniciarModulo ( ativarprompt ) {
        if ( ativarprompt ) {
            fracao1 = parseInt ( prompt ( "Informe o primeiro valor da fração!" ) );
            fracao2 = parseInt ( prompt ( "Informe o segundo valor da fração!" ) );
        }
        if ( fracao1 > fracao2 ) {
            alert ( "O primeiro valor da fração não pode ser maior que o segundo valor!" );
            iniciarModulo ( true );
        } else {
            calcularModulo ( );
        }
    }

    iniciarModulo ( );

</script>