HOWTO: Generando gráficas con PHP

PiradoIV

Bueno, después de meterme un poquito con el módulo GD de PHP... voy a poner un fragmento de código (100% de mi cosecha '¬¬) para crear un ejemplo de gráfica, si tenéis dudas o ideas para ir completándola, podéis responder al post :)

Vamos con el código:

<?php
// Creamos un gráfico de 170x50px
$im = imagecreate(170,50);

// Definimos el color blanco y además le
// decimos que sea el color del fondo.
// El primer color que definimos será el
// background

$im_blanco = imagecolorallocate($im,255,255,255);

// Definimos los demás colores.
$im_negro = imagecolorallocate($im,0,0,0);
$im_gris = imagecolorallocate($im,100,100,100);
$im_rejilla = imagecolorallocate($im,90,90,90);
$im_rojo = imagecolorallocate($im,255,0,0);
$im_verde = imagecolorallocate($im,0,255,0);
$im_azul = imagecolorallocate($im,0,0,255);
$im_media = imagecolorallocate($im,150,150,85);

// Hacemos el fondo de la rejilla.
imagefilledrectangle($im,1,1,168,39,$im_gris);

// Completamos el fondo de la gráfica
imageline($im,1,10,169,10,$im_rejilla);
imageline($im,1,20,169,20,$im_rejilla);
imageline($im,1,30,169,30,$im_rejilla);

// Asignamos unos puntos aleatorios a la gráfica
// para el ejemplo.

$random1rojo = rand(1,39);
$random2rojo = rand(1,39);
$random3rojo = rand(1,39);
$random4rojo = rand(1,39);
$random5rojo = rand(1,39);
$random1verde = rand(1,39);
$random2verde = rand(1,39);
$random3verde = rand(1,39);
$random4verde = rand(1,39);
$random5verde = rand(1,39);
$random1azul = rand(1,39);
$random2azul = rand(1,39);
$random3azul = rand(1,39);
$random4azul = rand(1,39);
$random5azul = rand(1,39);

// Definimos el valor de la media.
$mediaroja = ($random1rojo+$random2rojo+$random3rojo+$random4rojo+$random5rojo)/5;
$mediaverde = ($random1verde+$random2verde+$random3verde+$random4verde+$random5verde)/5;
$mediaazul = ($random1azul+$random2azul+$random3azul+$random4azul+$random5azul)/15;
$media = ($mediaroja+$mediaverde+$mediaazul)/3;

// Dibujamos la barra de media.
imageline($im,1,$media,168,$media,$im_media);

// Dibujamos las líneas roja, verde y azul.
imageline($im,1,$random1rojo,42,$random2rojo,$im_rojo);
imageline($im,42,$random2rojo,84,$random3rojo,$im_rojo);
imageline($im,84,$random3rojo,126,$random4rojo,$im_rojo);
imageline($im,126,$random4rojo,168,$random5rojo,$im_rojo);

imageline($im,1,$random1verde,42,$random2verde,$im_verde);
imageline($im,42,$random2verde,84,$random3verde,$im_verde);
imageline($im,84,$random3verde,126,$random4verde,$im_verde);
imageline($im,126,$random4verde,168,$random5verde,$im_verde);

imageline($im,1,$random1azul,42,$random2azul,$im_azul);
imageline($im,42,$random2azul,84,$random3azul,$im_azul);
imageline($im,84,$random3azul,126,$random4azul,$im_azul);
imageline($im,126,$random4azul,168,$random5azul,$im_azul);

// Dibujamos el borde negro de la gráfica.
imagerectangle($im,0,0,169,40,$im_negro);

// Dibujamos un rectángulo para escribir texto.
imagefilledrectangle($im,18,40,152,50,$im_negro);

// Le añadimos algo de texto explicativo.
imagestring($im,1,25,41,"Estadísticas al instante",$im_blanco);

// Enviamos el gráfico al explorador como png
// que es la mejor opción para gráficas.

imagepng($im);
?>

Bueno, modificando el código se puede hacer para que tome los datos de una base de datos o similar... ahora os toca a vosotros darle uso :P

Un saludo,
Pirado IV estuvo akí ;)

M

podrias poner un ejemplo del resultado? :P

PiradoIV

Un ejemplo:
http://www.vota.info/

Si le das a F5 todo el rato, la gráfica cambia aleatoriamente :)

Básicamente el código es el que he usado para hacer esa página pero quitándole la publicidad de la página.

Un saludo,
Pirado IV estuvo akí ;)

PiradoIV

Por cierto, para que os funcione el código, debéis tener PHP (4.3.0 como mínimo) y el módulo GD activado.

Un saludo,
Pirado IV estuvo akí ;)

PiradoIV

Hombre, si a alguien le interesa posteo un HOWTO para hacer flash dinámicamente con PHP... pero parece que lo último que le interesa a la gente en este foro de desarrollo y diseño web... es eso xD

Un saludo,
Pirado IV estuvo akí ;)

inkiet

PiradoIV, ya q te pones... pues ponlo ;)
Muy bueno lo de la imagen :)

sh4ck

ostia tio, ta muy guapo. por fin alguien que postea no solo para preguntar que pasa sino también para ayudar y enseñar ejemplos a la gente, creo que esta muy bien. a mi he gustado :)

PiradoIV

Graciasss, de todas formas podéis seguir investigando el tema de la edición de imágenes en http://www.php.net/manual/es/ref.image.php .

Salut !

C

Y graficos con barras al estilo de las comparativas de hard sabes si e sposible?

Seria un buen ahorro de tiempo respecto a hacerlas con algun soft tipo excel, sacar imagen y "pegarla" en la web.

PiradoIV

Es posible e incluso puede que más fácil... bueno, si tengo tiempo esta tarde posteo un ejemplo con el código.

Saludotes,
Pirado IV estuvo akí ;)

MoRkO

piradoooo a haser la web !!!! xD

PiradoIV

Ahaha, nen, que no puedo diseñar con la izquierda xD (cascarmela sip, ya ves xD).

Pirado IV estuvo akí ;)

Usuarios habituales