Crear gráficos de barras con PHP
14 COMENTARIOS - Publicado hace 42 meses - Clasificado en: GRAFICOS, PHP, TIPSEsta es una forma bastante sencilla de crear gráficos mediante PHP y HTML. A partir de una array, que podría construirse a partir de datos extraidos de una base de datos, se extraen los literales, se calcula el porcentaje y se le asigna un color para cada una de las barras.
Supongamos que tenemos unas visitas que proceden: 220 de google, 160 directas, 80 de bloglines, 10 de del.icio.us y 35 de yahoo. El script para generar un gráfico podría ser:
<html>
<style type="text/css">
<!--
table {
font: 11px Verdana, Arial, Helvetica, sans-serif;
color: #777;
padding:7px;
}
-->
</style>
<?php
$datosTabla = array(
array( "directas", 160, "#BDDA4C"),
array( "google", 220, "#FF9A68"),
array( "bloglines", 80, "#69ABBF"),
array( "del.icio.us", 10, "#FFDE68"),
array( "yahoo", 35, "#AB6487")
);
$maximo = 0;
foreach ( $datosTabla as $ElemArray ) { $maximo += $ElemArray[1]; }
?>
<body>
<table width="400" cellspacing="0" cellpadding="2">
<?php foreach( $datosTabla as $ElemArray ) {
$porcentaje = round((( $ElemArray[1] / $maximo ) * 100),2);
?>
<tr>
<td width="20%"><strong><?php echo( $ElemArray[0] ) ?></strong></td>
<td width="10%"><?php echo( $porcentaje ) ?>%</td>
<td>
<table width="<?php echo($porcentaje) ?>%" bgcolor="<?php echo($ElemArray[2]) ?>">
<tr><td></td></tr>
</table>
<</td>
</tr>
<?php } ?>
</table>
</body>
</html>
Ver ejemplo en funcionamiento » »
También te puede interesar:
| Crosslide: plugin jQuery para animaciones cross-fade | BookmarkDD: Deshazte de marcadores duplicados en Firefox | 10 plugins jQuery para realizar tooltips | 100 fondos de Twitter con ilustraciones | MobilePress: plugin para adaptar WordPress al móvil |
COMENTARIOS
|
|
Publicado hace 15 meses Hugo - Gracias por compartir esta información. Era lo que andaba buscando. Saludos =) |
|
|
Publicado hace 14 meses Ariel - Bueeenaaaa!!!!.. thank por conpartir... :) .... bueno, buenisimo.... Thank .. xau |
|
|
Publicado hace 13 meses Franklin - Muchas gracias amigos....es un muy buen aporte |
|
|
Publicado hace 12 meses Jonatan - alguna idea para hacer que se vea una especie de "regla" indicando los porcentajes o valores en la parte superior del grafico? El post muy bueno, me vino bien para lo que estoy haciendo |
|
|
Publicado hace 11 meses Urien - MuchÃsimas gracias!! Código sencillo y útil =) |
|
|
Publicado hace 11 meses Urien - Hola de nuevo! ¿Os habéis fijado que este gráfico se ve distinto con IE que con Firefox? Creo que el problema está en el padding de la tabla (definida con css). Saludos!! |
|
|
Publicado hace 10 meses Adrian - Mil gracias, codigo muuy util |
|
|
Publicado hace 8 meses Benjamin - Excelente. Encontré lo que buscaba. gracias. |
|
|
Publicado hace 6 meses jfgg01 - Senicllamente excelente y PODEROSO!!!! |
|
|
Publicado hace 5 meses Miguel - Excelente código, agradezco el aporte. Muy preciso y en pocas lÃneas de código!!! |
|
|
Publicado hace 5 meses Elros - Buen aporte, yo consegui el mismo efecto usando divs en lugar de tablas, mucho mas facil a la hora de usar css |
|
|
Publicado hace 2 meses cesar - http://www.ventadeweb.com muy bueno pero hay uan clase que haga eso ?? |
|
|
Publicado hace 2 meses Francisco - http://www.webintenta.com Hola, Existen bastantes librerÃas de PHP que facilitan la creación de gráficos con PHP. Quizá una de las más usadas sea pChart: http://pchart.sourceforge.net/ Saludos. |
|
|
Publicado hace 2 meses luis - me gustaria saber si existe la posibilidad de graficar verticalmente o que podris agregar para que me grafique verticalmente |





















diseño web valencia en 500 iconos gratuitos para tus aplicaciones web




