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

Otra forma de resolverlo

Buenas, chicos, les paso mi código con una forma alternativa de resolverlo. ¡Gracias por tu visita!

<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); 

    var color = ["blue","red","green"];
    var indice = 0; 

    function dibujarCirculo(evento){
        var x = evento.pageX - pantalla.offsetLeft;
        var y = evento.pageY - pantalla.offsetTop;  
        pincel.fillStyle = color[indice%3]; //se utiliza el resto de la cuenta "índice/3" para que recorra el array de forma cíclica sin necesidad de un if
        pincel.beginPath();
        pincel.arc(x,y,10,0,2*3.14);
        pincel.fill();
        console.log(x + "," + y);        
    }

    pantalla.onclick = dibujarCirculo;

    function alterarColor() {
        indice++;
        return false;
    }

    pantalla.oncontextmenu = alterarColor;

</script> 
1 respuesta

Hola Alejandro

Gracias por compartir tu código, está muy bien felicitaciones.

Si tienes alguna pregunta sobre el contenido de los cursos, estaremos aquí para ayudarte.

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