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

Cambiar color

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

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


    pincel.fillStyle = "lightblue";
    pincel.fillRect(0,0,600,400);
    var colores = ["red", "blue", "green", "yellow", "black", "purple"];
    var indiceColorActual = 0;

    function dibujarCirculo(evento) {

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

    }

    pantalla.onclick = dibujarCirculo

    function alterarColor() {
        indiceColorActual++
        if (indiceColorActual >= colores.length){
            indiceColorActual=0;
        }
        return false; 

    }

    pantalla.oncontextmenu = alterarColor;




</script>
2 respuestas

Hola Catherine, espero que esté bien.

Gracias por compartir tu código con nosotros, he probado aquí y el resultado ha sido muy bueno.

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

Hola, gracias por compartir tu código, gran trabajo. Slaudos cordiales