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)
2
respuestas

Duda acerca del radio de la flor.

¿Por qué el radio de la flor es 10?.

Creí que el diámetro en el código del instructor era la multiplicación de 2 * PI. Entonces supuse que el radio sería la mitad, ósea, PI. Luego descubrí que cada círculo quedaba muy pequeño.

¿Alguien me podría explicar cómo sacaron el radio?.

<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();
    }
</script>
2 respuestas
solución!

el radio se da como parametro al llamar la funcion. Creo que era 10. El 23.14 es cuanto de la circunferencia se grafica expresado en radianes. O sea 2Pi circunferencia completa.

El radio es un valor que tú das a la función para que dibuje [ pincel.arc(x, y, radio, 0, 2*3.14) radio es un valor que das ], yo modifique mi código para poder variar el radio con un solo valor y dibujar círculos homogéneos al escalarlos:

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

    function dibujarFlor(x,y,radio) {
        dibujarCirculo(x,y,radio,"red");
        dibujarCirculo(x,y-(radio*2),radio,"yellow");
        dibujarCirculo(x,y+(radio*2),radio,"blue");
        dibujarCirculo(x-(radio*2),y,radio,"orange");
        dibujarCirculo(x+(radio*2),y,radio,"green");
    }

dibujarFlor(300,200,30)

</script>