Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
2
respuestas

[Ayuda] no aparecen los circulos

He revisado mi código pero no encuentro el error, además en consola no lee la coordenada x.

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

<script>

    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");

    pincel.fillStyle="grey";
    pincel.fillRect(0,0,600,400);

    function escribirAlert(evento) {
        var x= evento.pageX-pantalla.offsetLeft;
        var y= evento.pageY-pantalla.offsetTop;
        console.log(evento);
         alert(x+" , "+y);
    }

    function dibujarCirculo(evento) {
        var x = evento.pageX-pantalla.offsetLeft;
        var y = evento.pageY-pantalla.offsetTop;

        pincel.fillStyle="blue";
        pincel.beginPath();
        pincel.arc(x,y,10,0,2*3.14);
        pincel.fill();
        console.log(x + " , " +y);
    }    

     pantalla.onclick= dibujarCirculo;


</script>   
2 respuestas

Hola Daniela, como estas? He probado el codigo que publicaste y funciona correctamente, tanto en pantalla, mostrando un circulo azul cuando hacemos click izquierdo, como mostrando las coordenadas en la consola del navegador. Por lo que pude probar funciona perfecto según lo pedido en la clase.

Ante cualquier consulta estamos en contacto. Saludos

Funciona correctamente. Prueba cerrando el navegador y reabriendo el archivo