Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Lo que aprendimos! Juego de disparo con botones de difcultad

<canvas width="1600" height="800"> </canvas>

<h1> JUEGO DE APUNTADO </h1>
<h2>Seleccionar Dificultad</h2>
<button onclick="facil()">Fácil</button>
<button onclick="media()">Media</button>
<button onclick="dificil()">Difícil</button>

<script>
var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");        
    pincel.fillStyle = "lightgrey";
    pincel.fillRect(0,0,1600,800);

    var radio = 10;
    var xAleatorio;
    var yAleatorio;

    function disenarCirculo(x, y, radio,color) {
        pincel.fillStyle = color;
        pincel.beginPath();
        pincel.arc(x, y, radio, 0, 2*Math.PI);
        pincel.fill();
    }

    function disenoobjetivo (x,y){
        disenarCirculo(x,y,radio + 20,"red");
        disenarCirculo(x,y,radio + 10,"white");
        disenarCirculo(x,y,radio, "red");


    }


    function limpiarCirculo() {
        pincel.clearRect(0, 0, 1600, 800);
    }

    var x = 0

    var intervalo = setInterval(limpiarPantalla,600);



    function Posicion(maximo){

        return Math.floor(Math.random()*maximo);

    }

    function limpiarPantalla() {

         limpiarCirculo();
        xAleatorio = Posicion(1600);
        yAleatorio = Posicion(800);
        disenoobjetivo(xAleatorio,yAleatorio);
         x++;

    }

function disparar(evento){

        var x = evento.pageX - pantalla.offsetLeft;
        var y = evento.pageY - pantalla.offsetTop;

     if ((x < xAleatorio + radio) &&
        (x  > xAleatorio - radio) &&      
        (y  < yAleatorio + radio) &&
        (y  > yAleatorio - radio) ) {
       alert("tiro acertado");
    }



}

function facil() {

    clearInterval(intervalo);
    intervalo = setInterval(limpiarPantalla, 800);
}
function media() {

    clearInterval(intervalo);
    intervalo = setInterval(limpiarPantalla, 600);
}
function dificil() {

    clearInterval(intervalo);
    intervalo = setInterval(limpiarPantalla, 400);
}

pantalla.onclick = disparar;
</script>
1 respuesta

¡Hola, Luis! Deseo que esté bien.

Muchas gracias por compartir tu proyecto con nosotros. Estamos muy contentos de poder acompañarte en tu camino de aprendizaje.

En lo esencial, en el foro estamos priorizando las dudas y errores.

Para compartir tus proyectos con nosotros y otros estudiantes, te recomiendo que lo haga en nuetro servidor de Discord.

Continúa con tus estudios y hasta la proxima.

¡Vamos juntos!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios