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

[Duda] no aparece el circulo

Al momento de revisar dar clic en la consola me aparecen las coordenadas de x,y como NaN,NaN, les comparto el codigo y si me pueden ayudar a ver el donde esta el error

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


<script>

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

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


    function exhibirAlerta(evento){
        var x = evento.pageX - pantalla.offesetLeft;
        var y = evento.pageY - pantalla.offesetTop;
        console.log(evento);
        alert(x + "," + y);
    }

    function dibujoCirculo(evento){
        var x = evento.pageX - pantalla.offesetLeft;
        var y = evento.pageY - pantalla.offesetTop;
        pincel.fillStyle = "black";
        pincel.beginPath();
        pincel.arc(x, y,20,0, 2*3.14);
        pincel.fill();
        console.log(x + "," + y);
    }

pantalla.onclick = dibujoCirculo;

</script>
2 respuestas

Ya vi mi error, en las variables x,y se me fue una letra de mas en .offset

var x = evento.pageX - pantalla.offesetLeft;

Es correcto, la función es .offsetLeft; se te una "e" de más.