for (2). Soluciones. Ejercicios (sin formularios). PHP. Bartolomé Sintes Marco. www.mclibre.org

En esta página se muestran una parte de las soluciones de los ejercicios for (2), concretamente el fragmento PHP, sin el principio ni el final de la página que se pueden dejar en fragmentos HTML.

for (2) 01 - Círculos en fila (1)

El título <h2> muestra el texto en singular si sólo se dibuja un círculo y en plural si se dibujan varios, por lo que habrá que usar una estructura if ... else ...for.
En el código fuente HTML del programa de ejemplo se puede ver que sólo se repite una línea, la que crea los <circle>. Esa línea es la que formará el cuerpo del bucle for, que debe ejecutarse tantas veces como indique el valor obtenido al azar.

Los valores del atributo cx son los siguientes:

Círculo	1	2	3	4	5	...	`\$\i`
cx	30	120	210	300	390	...	`\$\c\x`

Se trata de una sucesión aritmética cuya fórmula es `\$\c\x = 90 * \$\i - 60`.

<?php
$circulos = rand(1, 10);

if ($circulos == 1) {
    print "  <h2>$circulos círculo</h2>\n";
} else {
    print "  <h2>$circulos círculos</h2>\n";
}
print "\n";
print "  <p>\n";
print "    <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" "
    . "width=\"" . 90 * $circulos - 30 . "\" height=\"60\" style=\"border: black 1px solid\">\n";

for ($i = 1; $i <= $circulos; $i++) {
    print "      <circle cx=\"" . 90 * $i - 60 . "\" cy=\"30\" r=\"30\" fill=\"black\" />\n";
}

print "    </svg>\n";
print "  </p>\n";
?>

Si la variable de control $i del bucle for empezara por 0, habría que sacar la fórmula a partir de los siguientes valores:

Círculo	0	1	2	3	4	...	`\$\i`
cx	30	120	210	300	390	...	`\$\c\x`

Se trata de una sucesión aritmética cuya fórmula es `\$\c\x = 90 * \$\i + 30`.

<?php

for ($i = 0; $i < $circulos; $i++) {
    print "      <circle cx=\"" . 90 * $i + 30 . "\" cy=\"30\" r=\"30\" fill=\"black\" />\n";
}

?>

for (2) 02 - Círculos en fila (2)

La única diferencia con el ejercicio anterior es el atributo width de la etiqueta <svg>. Los valores de este atributo sólo dependen del número de círculos de la figura, por lo que la fórmula será una función de la variable `\$\c\i\r\c\u\l\o\s`:

Círculos	1	2	3	4	5	...	`\$\c\i\r\c\u\l\o\s`
width	60	150	240	330	420	...	`$width`

Se trata de una sucesión aritmética cuya fórmula es `$width = 90 * \$\c\i\r\c\u\l\o\s - 30`.

<?php
$circulos = rand(1, 10);

if ($circulos == 1) {
    print "  <h2>$circulos círculo</h2>\n";
} else {
    print "  <h2>$circulos círculos</h2>\n";
}
print "\n";
print "  <p>\n";
print "    <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" "
    . "width=\"" . 90 * $circulos - 30 . "\" height=\"60\" style=\"border: black 1px solid\">\n";

for ($i = 1; $i <= $circulos; $i++) {
    print "      <circle cx=\"" . 90 * $i - 60 . "\" cy=\"30\" r=\"30\" fill=\"black\" />\n";
}

print "    </svg>\n";
print "  </p>\n";
?>

for (2) 03 - Círculos en fila (3)

Las fórmulas de este ejercicio dependen de dos variables: el número de círculos y el radio de los círculos. Dándonos cuenta de que los valores `30`, `60` y `90` que aparecían en los ejercicios anteriores se debían a que el radio de los círculos era 30 y se trataba de `30 = $radio`, `60 = 2 * $radio` y `90 = 3 * $radio`, se puede deducir cómo habrá que modificar el programa.

<?php
$circulos = rand(1, 10);
$radio = rand(10, 50);

if ($circulos == 1) {
    print "  <h2>$circulos círculo de $radio px</h2>\n";
} else {
    print "  <h2>$circulos círculos de $radio px</h2>\n";
}
print "\n";
print "  <p>\n";
print "    <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" "
    . "width=\"" . 3* $radio * $circulos - $radio . "\" height=\"" . 2 * $radio . "\" style=\"border: black 1px solid\">\n";

for ($i = 1; $i <= $circulos; $i++) {
    print "      <circle cx=\"" . 3 * $radio * $i - 2 * $radio . "\" cy=\"$radio\" r=\"$radio\" fill=\"black\" />\n";
}

print "    </svg>\n";
print "  </p>\n";
?>

Otra manera de deducir estas fórmulas es escribir la posición cx y tamaño width en función del radio:

En el caso de la posición cx:

Círculo	1	2	3	4	5	...	`\$\i`
cx	`1 * $radio`	`4 * $radio`	`7 * $radio`	`10 * $radio`	`13 * $radio`	...	`\$\c\x`

... se trata de una sucesión cuya fórmula es `\$\c\x = (3 * \$\i - 2) * $radio = 3 * \$\i * $radio - 2 * $radio`.

En el caso del tamaño width:

Círculos	1	2	3	4	5	...	`\$\c\i\r\c\u\l\o\s`
width	`2 * $radio`	`5 * $radio`	`8 * $radio`	`11 * $radio`	`14 * $radio`	...	`$width`

... se trata de una sucesión cuya fórmula es `$width = (3 * \$\c\i\r\c\u\l\o\s - 1) * $radio = 3 * \$\c\i\r\c\u\l\o\s * $radio - $radio`.

for (2) 04 - Líneas (1)

En el código fuente HTML del programa de ejemplo se puede ver que sólo se repite una línea, la que crea los <line>. Esa línea es la que formará el cuerpo del bucle for, que debe ejecutarse tantas veces como indique el valor obtenido al azar.

Los valores del atributo x2 son los siguientes:

Línea	1	2	3	4	5	...	`$i`
x2	10	60	110	160	210	...	`$x2`

Se trata de una sucesión aritmética cuya fórmula es `$x2 = 50 * $i - 40`.

<?php
$lineas = rand(3, 10);

print "  <h2>$lineas líneas</h2>\n";
print "\n";
print "  <p>\n";
print "    <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" \n";
print "      width=\"500\" height=\"100\" style=\"border: black 1px solid\" >\n";

for ($i = 1; $i <= $lineas; $i++) {
    print "      <line x1=\"10\" y1=\"0\" x2=\"" . 50 * $i - 40 . "\" y2=\"100\" stroke=\"red\" stroke-width=\"1\" />\n";
}

print "    </svg>\n";
print "  </p>\n";
?>

for (2) 05 - Líneas (1)

En el código fuente HTML del programa de ejemplo se puede ver que sólo se repite una línea, la que crea los <line>. Esa línea es la que formará el cuerpo del bucle for, que debe ejecutarse tantas veces como indique el valor obtenido al azar.

Los valores del atributo x2 son los siguientes:

Línea	1	2	3	4	5	...	`$i`
x2	0	50	100	150	200	...	`$x2`

Se trata de una sucesión aritmética cuya fórmula es `$x2 = 50 * $i - 50`.

Por otro lado, los valores de los atributos width y view dependen del número de líneas del dibujo y son los siguientes:

Líneas	3	4	5	6	7	...	`$lineas`
width	150	200	250	300	350	...	`$width`

Se trata de una sucesión aritmética cuya fórmula es `$width = 50 * $lineas`.

<?php
$lineas = rand(3, 10);

print "  <h2>$lineas líneas</h2>\n";
print "\n";
print "  <p>\n";
print "    <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" \n";
print "      width=\"" . 50 * $lineas . "\" height=\"120\" "
    . " viewbox=\" -10 -10 " . 50 * $lineas . " 120\" style=\"border: black 1px solid\" >\n";

for ($i = 1; $i <= $lineas; $i++) {
    print "      <line x1=\"0\" y1=\"0\" x2=\"" . 50 * $i - 50 . "\" y2=\"100\" stroke=\"green\" stroke-width=\"1\" />\n";
}

print "    </svg>\n";
print "  </p>\n";
?>

for (2) 06 - Líneas (1)

En el código fuente HTML del programa de ejemplo se puede ver que sólo se repite una línea, la que crea los <line>. Esa línea es la que formará el cuerpo del bucle for, que debe ejecutarse tantas veces como indique el valor obtenido al azar.

Los valores del atributo x1 dependen del número de líneas del dibujo `$lineas` y son los siguientes:

Líneas	3	4	5	6	7	...	`$lineas`
x1	50	75	100	125	150	...	`$x1`

Se trata de una sucesión aritmética cuya fórmula es `$x1 = 25 * $lineas - 25`.

Mientras que los valores del atributo x2, como en el ejercicio anterior, dependen de la línea (`$i`) y son los siguientes:

Línea	1	2	3	4	5	...	`$i`
x2	0	50	100	150	200	...	`$x2`

Se trata de una sucesión aritmética cuya fórmula es `$x2 = 50 * $i - 50`.

Por otro lado, los valores de los atributos width y view dependen del número de líneas del dibujo y son los siguientes:

Líneas	3	4	5	6	7	...	`$lineas`
width	125	175	225	275	325	...	`$width`

Se trata de una sucesión aritmética cuya fórmula es `$width = 50 * $lineas - 25`.

<?php
$numero = rand(3,10);

print "  <h2>$numero líneas</h2>\n";
print "\n";
print "  <p>\n";
print "    <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" \n";
print "      width=\"" . 50 * $numero - 25 . "\" height=\"120\" "
    . " viewbox=\" -10 -10 " . 50 * $numero - 25 . " 120\" style=\"border: black 1px solid\" >\n";

for ($i = 1; $i <= $numero; $i++) {
    print "      <line x1=\"" . 25 * $numero - 25 . "\" y1=\"0\" x2=\"" . 50 * $i - 50 . "\" y2=\"100\" stroke=\"blue\" stroke-width=\"1\" />\n";
}

print "    </svg>\n";
print "  </p>\n";
?>

for (2) 07 - Arco iris circular

<?php
$numero = rand(3,10);
$paso = 360 / $numero;

print "  <h2>$numero colores</h2>\n";
print "\n";
print "  <p>\n";
print "    <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" \n";
print "      width=\"" . 60 * $numero . "\" height=\"" . 60 * $numero . "\" "
    . " viewbox=\"" . - 30 * $numero . " " . - 30 * $numero . " " . 60 * $numero . " " . 60 * $numero . "\">\n";

for ($i = 0; $i < $numero; $i++) {
    print "      <circle cx=\"0\" cy=\"0\" r=\"" . -30 * $i + 30 * $numero . "\" fill=\"hwb(" . round($i * $paso) . " 10% 10%)\" />\n";
}

print "    </svg>\n";
print "  </p>\n";
?>

for (2) 08 - Arco iris semicircular

<?php
$numero = rand(3,10);
$paso = 360 / $numero;

print "  <h2>$numero franjas</h2>\n";
print "\n";
print "  <p>\n";
print "    <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" \n";
print "      width=\"" . 60 * $numero + 20 . "\" height=\"" . 30 * $numero + 20 . "\" "
    . " viewbox=\"" . - 30 * $numero - 10 . " " . - 30 * $numero - 10 . " " . 60 * $numero + 20 . " " . 30 * $numero + 20 . "\" style=\"border: black 1px solid; background-color: white;\">\n";

for ($i = 0; $i < $numero; $i++) {
    $valor =  -30 * $i + 30 * $numero;
    print "      <path d=\"M -$valor,0 L $valor,0 A $valor $valor 0 0 0 -$valor,0 z\" fill=\"hwb(" . round($i * $paso) . " 10% 10%)\" />\n";
}

print "    </svg>\n";
print "  </p>\n";
?>

for (2) 09 - Arco iris

<?php
$numero = rand(3,10);
$paso = 360 / $numero;

print "  <h2>$numero franjas</h2>\n";
print "\n";
print "  <p>\n";
print "    <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" \n";
print "      width=\"" . 60 * $numero + 20 . "\" height=\"" . 30 * $numero + 20 . "\" "
    . " viewbox=\"" . - 30 * $numero - 10 . " " . - 30 * $numero - 10 . " " . 60 * $numero + 20 . " " . 30 * $numero + 20 . "\" style=\"border: black 1px solid; background-color: white;\">\n";

for ($i = 0; $i < $numero; $i++) {
    $valor =  30 * $numero - 15 * $i;
    print "      <path d=\"M -$valor,0 L $valor,0 A $valor $valor 0 0 0 -$valor,0 z\" fill=\"hwb(" . round($i * $paso) . " 10% 10%)\" />\n";
}
$valor = 15 * $numero;
print "      <path d=\"M -$valor,0 L $valor,0 A $valor $valor 0 0 0 -$valor,0 z\" fill=\"white\" stroke=\"white\" />\n";
print "    </svg>\n";
print "  </p>\n";
?>

Ejercicios (sin formularios) - for (2) - Soluciones