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

[Duda] Diseñando una flor

Siento que no queda al centro con los valores en (x,y) que nos dan de referencia asi que los movi un poco, si no se ven centrados, les agradeceria si me lo hacen saber, gracias!

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

<script>

    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");
    pincel.fillStyle = "lightgray";
    pincel.fillRect(0, 0, 600, 400);

    function dibujarCirculo(x, y, radio, color) {

        pincel.fillStyle = color;
        pincel.beginPath();
        pincel.arc(x, y, radio, 0, 2*3.14);
        pincel.fill();
    }

    dibujarCirculo(260,200,20,"red");
    dibujarCirculo(220,200,20,"orange");
    dibujarCirculo(260,240,20,"blue");
    dibujarCirculo(300,200,20,"black");
    dibujarCirculo(260,160,20,"yellow");


</script>
2 respuestas

Hola Luis, prueba con este codigo

        dibujarCirculo(300, 220, 10, "blue");
        dibujarCirculo(300, 200, 10, "red");
        dibujarCirculo(300, 180, 10, "yellow");
        dibujarCirculo(280, 200, 10, "orange");
        dibujarCirculo(320, 200, 10, "black");
Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios, saludos.

Hola Luis, para centrarla solo ubica el centro del lienzo (canvas) que es de entonces el centro esta en el punto x = 300 y y = a 200 por eso es que Willy te comenta ese código.

así también lo hice en el mío

look: