3
respostas

Meu código não esta funcionando, ao invés de os alvo aparecerem e desaparecerem so a cor da minha tela esta fazendo isso.

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

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


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



  function desenhacirculo(x,y,raio,cor){
      pincel.fillstyle=cor;
      pincel.beginpath()
      pincel.arc(x,y,raio,0,2*Math.PI)
      pincel.fill()
  }
 function limpatela(){
     pincel.clearRect(0,0,600,400)
 }

function desenhaAlvo(x,y){
   desenhacirculo(x,y,30,'red')   
  desenhacirculo(x,y,20,'white')
 desenhacirculo(x,y,10,'red')
}
     function sorteiaposicao(maximo){
         return Math.floor(Math.random()* maximo )
        }

      function atualzatela(){
        limpatela();
        var xaleatorio=sorteiaposicao(600)
        var yaleatorio=sorteiaposicao(400)

}
         setInterval(atualzatela,500  ); 



</script>
3 respostas

Boa Tarde Chara kkk Faltou você chamar a função desenha alvo no final da função atualiza tela();

````desenhaAlvo(xAleatorio,yAleatorio);``

Depois finalize a função do dispara.

 function dispara() {

        var x = event.pageX - tela.offsetLeft;
        var y = event.pageY - tela.offsetTop;


        if( (x > xAleatorio - raio) 
             &&(x < xAleatorio + raio)  
            && (y > yAleatorio - raio)
            &&(y < yAleatorio + raio)) {

            alert('Você ACERTOU!!');
        }
    }    

    tela.onclick = dispara;

</script>

Quando vc clicar no centro do alvo ele retornará que vc acertou.

Espero ter ajudado.