Esto lo vamos a colocar en la cabecera de la página o en la declaración de estilos global d nuestro sitio.
Si nos fijamos, hemos utilizado 10 diferentes estilos para definir los distintos tamaños de las etiquetas de la nube. Cada una con un porcentaje superior del tamaño del texto.
Código PHP para hacer la nube de etiquetas
En este script he simplificado bastante la creación de la nube de etiquetas, para centrarnos en lo que realmente nos interesa en un principio, que cada etiqueta aparezca en la nube con un tamaño de texto relativo al número de apariciones que tiene.
Array de etiquetas
Las etiquetas de la nube las vamos a extraer de un array que tenemos que generar previamente. Utilizaremos un array asociativo, donde el índice de cada elemento tendrá el nombre de cada etiqueta. Como valor del array tendremos el número de apariciones de esa etiqueta.
Por ahora vamos a escribir directamente el código literal para la creación del array. Para posteriores artículos dejamos la explicación sobre como generarlo a partir información extraída de una base de datos.
$etiquetas = array(
"HTML"=>10,
"PHP"=>15,
"ASP"=>6,
"Promoción de webs"=>5,
"Programación"=>8,
"Javascript"=>12,
"Ajax"=>5,
".NET"=>3,
"FAQ"=>2,
"SEO"=>9,
"CSS"=>12,
"XHTML"=>8,
"Desarrollo Web"=>12,
"Diseño"=>8,
"Ganar dinero"=>6,
"Freelance"=>2,
"Cookies"=>3,
"Software"=>10,
"DHTML"=>7,
"Cross-Browser"=>1
);
Función PHP para la creación de la nube de etiquetas
Ahora vamos a ver la función que construye la nube de etiquetas. Se trata de recorrer el array y escribir, una a una, todas las etiquetas que contiene con los tamaños apropiados.
function nube_etiquetas($etiquetas){
//saco los valores máximo y minimo de la apariciones de etiquetas
$valor_max = max($etiquetas);
$valor_min = min($etiquetas);
$diferencia = $valor_max - $valor_min;
//ordeno el array
ksort($etiquetas);
//creo la capa donde se van a mostrar las etiquetas
echo '<div class="nube">';
echo '<div class="etiquetas">';
foreach ($etiquetas as $nombreetiqueta=>$apariciones){
//calculo un valor de 0 a 10 para cada etiqueta, porcentualmente según valores máximos y mínimos encontrados
$valor_relativo = round((($apariciones - $valor_min) / $diferencia) * 10);
//escribo las etiquetas con su estilo dependiendo del valor porcentual
echo "<span class='etiquetatam$valor_relativo'>";
echo $nombreetiqueta;
echo "</span> ";
}
//meto una capa sin float para que tome todo el alto de las etiquetas
echo "<div style='clear:both'></div>";
//cierro la nube y las etiquetas
echo '</div>';
echo '</div>';
}
Usuarios que han visto este tema también han visto...
- Mostrar datos de un consulta PHP con MySQL
- Enviar un mail con PHP
- De segundos a horas, minutos y segundos con PHP
- Ejecutar scripts PHP automáticamente desde el cron con CURL
- Crear imágenes GIF desde PHP
- Versión imprimible de este documento
- Enviar por e-mail este documento
