Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Minha solução do desafio!

<canvas width="600" height="400"></canvas>
<script>
  var tela = document.querySelector('canvas')
  var pincel = tela.getContext('2d')

  pincel.fillStyle = 'lightgrey'
  pincel.fillRect(0, 0, 600, 400)

  var numerador = prompt('Digite o numerador da fração:')
  var denominador = prompt('Digite o denominador da fração:')

  function desenharTexto(text, x, y) {
    pincel.font = '20px Verdana'
    pincel.fillStyle = 'black'
    pincel.fillStyle = 'bold'
    pincel.fillText(text, x, y)
  }

  function desenharQuadrado(x, y) {
    pincel.fillStyle = 'green'
    pincel.fillRect(x, y, 50, 50)
  }

  function desenharFracao(numerador, denominador, y) {
    for (let d = 0; d < denominador; d++) {
      pincel.strokeStyle = 'black'
      pincel.strokeRect(d * 53, 60, 50, 50)
      for (let i = 0; i < numerador; i++) {
        desenharQuadrado(i * 53, 60)
      }
    }
  }

  function desenhaResposta(resposta, x, y) {
    pincel.fillStyle = 'red'
    pincel.fillText(resposta, x, y)
  }

  desenharTexto('Qual é a fração?', 50, 30)
  desenharFracao(numerador, denominador, 60)

  desenhaResposta(`Resposta: ${numerador}/${denominador}`, 50, 150)
</script>
1 resposta
solução!

Olá Antonio, tudo certo ?

Muito bacana a implementação e a disposição de compartilhar a solução com a gente, com certeza pode ajudar alguém que for buscar a solução !!

Qualquer dúvida, estarei à disposição :)

Forte abraço e bons estudos!!