Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Seu random estava errado. Ainda tem coisa errada no código abaixo. Mas o chefe chegou. rs..
<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);
var raio = 10;
var xAleatorio;
var yAleatorio;
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);
}
desenhaCirculo(100, 100, raio+20, "red");
desenhaCirculo(100, 100, raio+10, "wite");
desenhaCirculo(100, 100, raio, "red");
function desenhaAlvo(x, y){
desenhaCirculo(x, y, raio, + 30, "red");
desenhaCirculo(x, y, raio, + 20, "white");
desenhaCirculo(x, y, raio, + 10, "red");
}
function sorteiaPosicao(maximo){
return Math.floor(Math.random()) * (maximo);
}
function atualizaTela(){
limpaTela(); //Tem que limpar antes de desenhar um novo alvo.
xAleatorio = sorteiaPosicao(600);
yAleatorio = sorteiaPosicao(400);
desenhaAlvo(xAleatorio, yAleatorio);
}
setInterval(atualizaTela, 1000);
function dispara(evento){
var x = evento.pagex - tela.offsetLeft;
var y = evento.pagay - tela.offsetTop;
if((x > xAleatorio - raio)
&& (x < xAleatorio + raio)
&& (y > yAleatorio - raio)
&& (y < yaleatorio + raio)){
alert("Acertou!");
}
}
tela.onclick = dispara;
</script>
você esta usando a função que sorteia números errado
Math.floor(Math.random() * maximo);e não
Math.floor(Math.random) * (maximo);o resultado da sua função do jeito que está da NaN ou seja Não é número, troque pro jeito certo
Boa Mauricio!