Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Ela troca só até voltar pra primeira cor

Olá. Consegui faze um código. Ele começa em azul, troca pro vermelho, troca pro verde, volta pro azul, mas em seguida para de trocar de cor. Não consegui encontrar o erro.

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

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

    pincel.fillStyle = 'grey';
    pincel.fillRect(0, 0, 600, 400);
    let cor = 'blue';
    let cores = ['blue', 'red', 'green'];
    let contador = 0

    function  desenhaCirculo(evento) {
        let x = evento.pageX - tela.offsetLeft;
        let y = evento.pageY - tela.offsetTop;
        pincel.fillStyle = cor;
        pincel.beginPath();
        pincel.arc(x, y, 5, 0, 2 * 3.14);
        pincel.fill();
    }

    tela.onclick = desenhaCirculo;

    function  mudaCorDoCirculo() {
        if(contador == 0) {
            cor = cores[1];
            contador++;
            return false;
        } else if(contador == 1) {
            cor = cores[2];
            contador++
            return false;
            } else {
                cor = cores[0];
            }
        }

    tela.oncontextmenu = mudaCorDoCirculo;

</script>
2 respostas
solução!

Oi Eduardo

Você precisa zerar o contador no else para ele retornar pro primeiro IF seguindo sua lógica, porque se não zerar ele sempre vai cair no else e ficar só no azul assim:

function mudaCorDoCirculo() {
    if (contador == 0) {
      cor = cores[1];
      contador++;
      return false;
    } else if (contador == 1) {
      cor = cores[2];
      contador++;
      return false;
    } else {
      contador = 0;
      cor = cores[0];
    }
  }

Parabéns pelo empenho nos estudos!

Continue praticando e qualquer dúvida pode contar com a gente.

Entendi. Verdade. kk Muito obrigado.