Código de PHP - 'Etiquetas más populares' o 'nubes de tags'

Imágen de perfil

'Etiquetas más populares' o 'nubes de tags'gráfica de visualizaciones


PHP

Publicado el 03 de Noviembre del 2007 por Xavi
11.986 visualizaciones desde el 03 de Noviembre del 2007. Una media de 28 por semana
Código que muestra como utilizar 'Etiquetas más populares' o 'nubes de tags' de tres maneras:
- Cambiando el tamaño
- Cambiando el color
- Cambiando el color y tamaño

Versión 1

Publicado el 03 de Noviembre del 2007gráfica de visualizaciones de la versión: Versión 1
11.987 visualizaciones desde el 03 de Noviembre del 2007. Una media de 28 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
<?php
/*
 * Como utilizar "Etiquetas más populares" o "nubes de tags" con PHP y MySQL
 *
 * En este ejemplo, vamos a mostrar como crear un listado de etiquetas mas populares.
 * Para este ejemplo las etiquetas estan en un array, pero pueden estar en una
 *  base de datos. Si estan en una base de datos, tendriamos que llenar el array
 *  con una consulta en la base de datos.
 *
 * http://www.lawebdelprogramador.com
 */
 
$etiquetas="la web del programador, codigo, texto, cursos, tags, palabra, lawebdelprogramador, la web del programador, php, mysql, lawebdelprogramador, php, lawebdelprogramador, codigo, tags, lawebdelprogramador, Etiquetas, populares, palabra, lawebdelprogramador, Etiquetas, lawebdelprogramador, lawebdelprogramador, lawebdelprogramador, lawebdelprogramador, lawebdelprogramador, codigo, lawebdelprogramador, lawebdelprogramador, Etiquetas, cursos, temas, lawebdelprogramador, Etiquetas, la web del programador, codigo, texto, cursos, tags, palabra, lawebdelprogramador, la web del programador, php, mysql, lawebdelprogramador, php, lawebdelprogramador, codigo, tags, lawebdelprogramador, Etiquetas, populares, palabra, lawebdelprogramador, Etiquetas, lawebdelprogramador, lawebdelprogramador, lawebdelprogramador, lawebdelprogramador, lawebdelprogramador, codigo, lawebdelprogramador, lawebdelprogramador, Etiquetas, links, cursos, temas, lawebdelprogramador, Etiquetas, mysql, cursos";
?>
<html>
<head>
<title>Ejemplo de como utilizar "Etiquetas más populares" o "nubes de tags" con PHP</title>
<style type="text/css">
<!--
	/*order ok: link,visited,hover,active*/
	A {text-decoration:none;color:#0000ff;}
	A:hover {color:#0000ff;}
	A:active {color:#0000ff;}

	/*cambio de tamaño en las etiquetas*/
	.link_a1{font-size:0.8em;}
	.link_a2{font-size:0.9em;}
	.link_a3{font-size:1em;}
	.link_a4{font-size:1.1em;}
	.link_a5{font-size:1.2em;}
	.link_a6{font-size:1.3em;}
	.link_a7{font-size:1.4em;}
	.link_a8{font-size:1.5em;}
	.link_a9{font-size:1.6em;}
	.link_a10{font-size:1.7em;}
	.link_a20{font-size:2em;}
	.link_a30{font-size:2.2em;}
	.link_a40{font-size:2.5em;}
	.link_a50{font-size:3em;}

	/*cambio de color en las etiquetas*/
	.link_b1{color:#bbbbff;}
	.link_b2{color:#aaaaff;}
	.link_b3{color:#8888ff;}
	.link_b4{color:#7777ff;}
	.link_b5{color:#6666ff;}
	.link_b6{color:#5555ff;}
	.link_b7{color:#4444ff;}
	.link_b8{color:#3333ff;}
	.link_b9{color:#2525ff;}
	.link_b10{color:#2222ff;}
	.link_b20{color:#1515ff;}
	.link_b30{color:#1111ff;}
	.link_b40{color:#0505ff;}
	.link_b50{color:#0000ff;}

	/*cambio de tamaño y color en las etiquetas*/
	.link_c1{font-size:0.8em;color:#bbbbff;}
	.link_c2{font-size:0.9em;color:#aaaaff;}
	.link_c3{font-size:1em;color:#8888ff;}
	.link_c4{font-size:1.1em;color:#7777ff;}
	.link_c5{font-size:1.2em;color:#6666ff;}
	.link_c6{font-size:1.3em;color:#5555ff;}
	.link_c7{font-size:1.4em;color:#4444ff;}
	.link_c8{font-size:1.5em;color:#3333ff;}
	.link_c9{font-size:1.6em;color:#2525ff;}
	.link_c10{font-size:1.7em;color:#2222ff;}
	.link_c20{font-size:2em;color:#1515ff;}
	.link_c30{font-size:2.2em;color:#1111ff;}
	.link_c40{font-size:2.5em;color:#0505ff;}
	.link_c50{font-size:3em;color:#0000ff;}

	.block1{margin-top:10px;width:600;border:1px solid #808080;padding:5px;font-family:Arial;}
	.block2{margin-top:10px;width:600;border:1px solid #808080;padding:5px;font-family:Arial;font-size:1em;font-weight:bold;}
-->
</style>
</head>
 
<body>
<h1>Ejemplo de como utilizar "Etiquetas más populares" o "nubes de tags" con PHP</h1>
<form action='<?php echo $_SERVER["PHP_SELF"]?>' method='post'>
	Introduce las etiquetas que desees separadas por comas...
	<br /><textarea name="chars" cols=50 rows=10><?php echo ($_POST["chars"]?$_POST["chars"]:$etiquetas)?></textarea>
	<br /><input type='submit' name='enviar' value='enviar' />
</form>
 
<?php
//Si hemos recibido algun valor...
if($_POST["chars"])
{
	//Comprobamos si el ultimo caracter de la cadena es una coma. Si lo es, lo eliminamos
	if(substr($_POST["chars"],-1,1)==",")
		$_POST["chars"]=substr($_POST["chars"],0,strlen($_POST["chars"])-1);
	//Separamos el contenido por las comas, y lo colocamos en un array ($tags)
	$tags=explode(",",strtolower($_POST["chars"]));
	//Ejecutamos la funcion PrepareTags para cada elemento del array
	array_walk($tags,'PrepareTags');
	//Codgemos el total de valores del array para crear el %
	$total=count($tags);
	//Contamos los valores del array, devolviendo array(valor1=>repeticiones,valor2=>repeticiones,...
	$tags=array_count_values($tags);
 
	//Ordenamos la matriz por las repeticiones de mayor a menor
	arsort($tags);
	//unicamente cogemos los 30 primeros valores
	$tags=array_slice($tags,0,30);
 
	//Ordenamos la matriz por los valores
	ksort($tags);
 
	showTagsHeight($tags,$total);
	showTagsColor($tags,$total);
	showTagsHeightColor($tags,$total);
}
 
/*
 * Funcion que muestra las Etiquetas modificando el tamaño de las mismas
 */
function showTagsHeight($tags,$total)
{
	echo "<h2>Cambio de tamaño en las etiquetas</h2>";
	echo "<div class='block1'>";
	//Iniciamos un bucle hasta el final del array que hemos creado (tags) cogiendo
	//los valores en las variable valor y la repeticiones
	foreach($tags as $valor=>$repeticiones)
	{
		//determinanos que % de veces aparece este valor
		$estilo=ceil($repeticiones*100/$total);
		if($estilo>50)
			$estilo=50;
		elseif($estilo>40)
			$estilo=40;
		elseif($estilo>30)
			$estilo=30;
		elseif($estilo>20)
			$estilo=20;
		elseif($estilo>10)
			$estilo=10;
 
		//mosramos la etiqueta
		echo "\n<span style='padding-right:10px;'><a href='?tag=".$valor."' class='link_a".$estilo."' title='".round($repeticiones*100/$total)."% con ".$repeticiones." Entradas'>".$valor."</a> (".$repeticiones.") </span>";
	}
	echo "</div>";
}
 
/*
 * Funcion que muestra las Etiquetas modificando el color de las mismas
 */
function showTagsColor($tags,$total)
{
	echo "<h2>Cambio de color en las etiquetas</h2>";
	echo "<div class='block2'>";
	//Iniciamos un bucle hasta el final del array que hemos creado (tags) cogiendo
	//los valores en las variable valor y la repeticiones
	foreach($tags as $valor=>$repeticiones)
	{
		//determinanos que % de veces aparece este valor
		$estilo=ceil($repeticiones*100/$total);
		if($estilo>50)
			$estilo=50;
		elseif($estilo>40)
			$estilo=40;
		elseif($estilo>30)
			$estilo=30;
		elseif($estilo>20)
			$estilo=20;
		elseif($estilo>10)
			$estilo=10;
 
		//mosramos la etiqueta
		echo "\n<span style='padding-right:10px;'><a href='?tag=".$valor."' class='link_b".$estilo."' title='".round($repeticiones*100/$total)."% con ".$repeticiones." Entradas'>".$valor."</a> (".$repeticiones.") </span>";
	}
	echo "</div>";
}
 
/*
 * Funcion que muestra las Etiquetas modificando el color y tamaño de las mismas
 */
function showTagsHeightColor($tags,$total)
{
	echo "<h2>Cambio de color y tamaño en las etiquetas</h2>";
	echo "<div class='block1'>";
	//Iniciamos un bucle hasta el final del array que hemos creado (tags) cogiendo
	//los valores en las variable valor y la repeticiones
	foreach($tags as $valor=>$repeticiones)
	{
		//determinanos que % de veces aparece este valor
		$estilo=ceil($repeticiones*100/$total);
		if($estilo>50)
			$estilo=50;
		elseif($estilo>40)
			$estilo=40;
		elseif($estilo>30)
			$estilo=30;
		elseif($estilo>20)
			$estilo=20;
		elseif($estilo>10)
			$estilo=10;
 
		//mosramos la etiqueta
		echo "\n<span style='padding-right:10px;'><a href='?tag=".$valor."' class='link_c".$estilo."' title='".round($repeticiones*100/$total)."% con ".$repeticiones." Entradas'>".$valor."</a> (".$repeticiones.") </span>";
	}
	echo "</div>";
}
 
//Recogemos el valor por referencia, de esta manera las modificaciones que
//realicemos se veran afectadas en el array directamente.
function PrepareTags(&$valor,$repeticion)
{
	//Eliminamos los espacios en blanco
	$valor=trim($valor);
	//Si tiene mas de dos espacios juntos los eliminamos
	do{
		$pos=strpos($valor,"  ");
		$valor=str_replace("  "," ",$valor);
	}while($pos>0);
}
?>
</body>
</html>



Comentarios sobre la versión: Versión 1 (0)


No hay comentarios
 

Comentar la versión: Versión 1

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios

http://lwp-l.com/s1592