1
respuesta

Les comparto mi solucion

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

<script>

    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");
    var colors = ["blue", "red", "green"]
    var index = 0

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

    function dibujarCirculo(evento){
        var x = evento.pageX - pantalla.offsetLeft;
        var y = evento.pageY - pantalla.offsetTop;    
        pincel.fillStyle = colors[index];
        pincel.beginPath();
        pincel.arc(x,y,10,0,2*3.14);
        pincel.fill();
        console.log(x + "," + y);        
    }

    pantalla.onclick = dibujarCirculo;

    function alterarColor() {
        index = index + 1
        if(index == colors.length){
            index = 0
        }
        console.log(index)
        return false;
    }

    pantalla.oncontextmenu = alterarColor;

</script> 
1 respuesta

Hola Moisés, espero que estés bien! Gracias por compartir tu código con nosotros. Si tiene alguna pregunta sobre el contenido del curso, estamos aquí para ayudarlo. ¡Sigue practicando! ¡Vamos juntos! :)

Si este post te ayudó, por favor, marca como solucionado ✓.

.