Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Solucionado (ver solución)
Solucionado
(ver solución)
3
respuestas

Cambio de color con click derecho

Buenas noches, el siguiente código lo copie tal cuál del instructor pero no me funciona el cambio de color y no puedo dar con la falla.

<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 colores = ["blue", "red", "green"];
    var indiceColorActual = 0; // comienza con blue

    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; //vuelve para el primer color, blue
        }
        return false; //menú contextual padrón de `canvas` no sea exhibido
    }

    pantalla.oncontextmenu = alterarColor;

</script>
3 respuestas

Hola Alejandro!

Copié el código, lo ejecuté y me funciona perfecto. Tené en cuenta que para cambiar de color es el botón derecho del mouse.

Saludos!

Gracias por la respuesta Gonzalo entendí mal el concepto del trabajo. Interprete que al hacer clic derecho cambiaria el color de un circulo azul existente y no era así jaja. Saludos!

solución!

No pasa nada Alejandro. Si la respuesta te sirvió, no olvidés marcarla como solucionado por si otro compañero le pasa lo mismo

Saludos