Solucionado (ver solución)
Solucionado
(ver solución)
1
respuesta

Lo aprendido

Esto es lo aprendido:

<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 i = 0;
    var color = ["blue", "red", "green"];
    function dibujarCirculo(evento) {
        var x = evento.pageX - pantalla.offsetLeft;
        var y = evento.pageY - pantalla.offsetTop;
        pincel.fillStyle = color[i];
        pincel.beginPath();
        pincel.arc(x, y, 15, 0, 2 * 3.14);
        pincel.fill();
        console.log(x + "," + y);
    }

    pantalla.onclick = dibujarCirculo;

    function elegirColor(color) {

        i = i + 1;

        if (i > 2) {
            i = 0
        }

        return false


        pincel.fillStyle = color[i];


    }

    pantalla.oncontextmenu = elegirColor;

</script>

Cada vez es más dificil resolver los problemas pero aprendo

1 respuesta
solución!

¡Hola José!

Es genial que estés practicando con juegos y animaciones en el curso de Lógica de Programación.

En cuanto a tu código, veo que estás utilizando la etiqueta canvas para crear un lienzo en el que se pueden dibujar formas. Luego, estás utilizando el contexto 2D para dibujar un rectángulo gris en todo el lienzo y un círculo cada vez que se hace clic en el lienzo.

También veo que tienes una función llamada "elegirColor" que cambia el color del círculo que se dibuja cada vez que se hace clic con el botón derecho del ratón.

Si tienes alguna pregunta específica sobre este código o si necesitas ayuda para resolver algún problema en particular, no dudes en preguntar.

¡Espero haber ayudado y buenos estudios!

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