JpGraph: Graficos con PHP

  • 18/10/2007
  • 10:16 am
  • unijimpe

JpGraph es una librería PHP que te permitirá crear gráficos matemáticos y estadísticos de manera sencilla y con absoluto control. Esta librería soporta una amplia variedad de tipos de gráficos para todas las necesidades.

jpgraph_logo.png

Características
JpGraph es una librería muy completa y entre las características mas destacadas podemos listar:

  • Soporte para GD1 y GD2, la librería auto detecta que versión del GD.
  • Soporte para incluir texto a las imágenes y soporte para tipos de letra.
  • Soporte para niveles de transparencia.
  • Soporte para gráficos complejas de Gantt.
  • Manejo de las escalas para los ejes del gráfico.
  • Soporta formatos PNG, GIF y JPG.
  • Soporte para gráficas de barras horizontales.
  • Soporte para gráficas de tipo científico.
  • Soporte para generación de la escala automática dependiendo de los datos.
  • Soporta varios tipos de relleno para las gráficas.
  • Documentación muy completa y con una referencia completa de las funciones.

Generando Gráficos de Líneas
El primer ejemplo que veremos es la generación de gráficos de líneas. Luego de haber descargado los archivos fuente de esta librería en JpGraph Download creamos nuestro archivo php en cual cual incluimos primero el archivo jpgraph.php el cual contiene las funciones básicas y luego el archivo jpgraph_line.php que contiene las funciones especificas para la creación de gráficos de linea.

PHP:
  1. <?php
  2. // Incluimos los archivos necesarios
  3. include("inc/jpgraph.php");
  4. include("inc/jpgraph_line.php");
  5. // Creamos el array de datos
  6. $ydata = array(11, 3, 8, 12, 5, 1, 9, 13, 5, 7);
  7. // Creamos un nuevo grafico de 350x250
  8. $graph = new Graph(350, 250, "auto");   
  9. $graph->SetScale( "textlin");
  10. // Creamos el grafico basado en el array
  11. $lineplot = new LinePlot($ydata);
  12. $lineplot->SetColor("blue");
  13. // Agregamos el grafico a la imagen
  14. $graph->Add( $lineplot);
  15. // Mostramos la imagen
  16. $graph->Stroke();
  17. ?>

Podemos notar que hemos creado primero la imagen de 350x250 y con los ejes autoescalados, luego creamos un objeto que contiene el gráfico de lineas, posteriormente agregamos este gráfico a la imagen principal y la enviamos al cliente mediante Stroke.

demo-line.png

Personalizando el gráfico
Ahora si deseamos asignarle un titulo, controlar los margenes de la imagenes e incluso colocar nombres a los ejes tendríamos el siguiente ejemplo:

PHP:
  1. include("inc/jpgraph.php");
  2. include("inc/jpgraph_line.php");
  3.  
  4. $ydata = array(11, 3, 8, 12, 5, 1, 9, 13, 5, 7);
  5. $graph = new Graph(350, 250, "auto");   
  6. $graph->SetScale( "textlin");
  7. $graph->img->SetMargin(40, 20, 20, 40);
  8. $graph->title->Set("JpGraph Demo");
  9. $graph->xaxis->title->Set("Altura");
  10. $graph->yaxis->title->Set("Total");
  11.  
  12. $lineplot = new LinePlot($ydata);
  13. $lineplot->SetColor("blue");
  14.  
  15. $graph->Add($lineplot);
  16. $graph->Stroke();

Con lo cual obtenemos el siguiente resultado en el cual hemos personalizado nuestra gráfica.

demo-lineadv.png

Agregando mas de un Gráfico
Ahora que pasa si deseamos incluir mas de un gráfico en una misma imagen?. Simplemente creamos dos variables en donde creamos los objetos de gráfico y al final lo adjuntamos a la imagen principal como se muestra en el siguiente código.

PHP:
  1. include("inc/jpgraph.php");
  2. include("inc/jpgraph_line.php");
  3.  
  4. $ydata1 = array(11, 3, 8, 12, 5, 1, 9, 13, 5, 7);
  5. $ydata2 = array(1, 19, 15, 7, 22, 14, 5, 9, 21, 13);
  6.  
  7. $graph = new Graph(350, 250, "auto");   
  8. $graph->SetScale( "textlin");
  9. $graph->img->SetMargin(40, 20, 20, 40);
  10. $graph->title->Set("JpGraph Demo");
  11. $graph->xaxis->title->Set("Altura");
  12. $graph->yaxis->title->Set("Total");
  13.  
  14. $lineplot1 = new LinePlot($ydata1);
  15. $lineplot1->SetColor("blue");
  16. $lineplot2 = new LinePlot($ydata2);
  17. $lineplot2->SetColor("orange");
  18.  
  19. $graph->Add($lineplot1);
  20. $graph->Add($lineplot2);
  21. $graph->Stroke();

Como pueden ver es muy semejante al ejemplo anterior pero con la diferencia que se manejan dos objetos de imagen y se obtiene el siguiente resultado.

demo-linetwo.png

Generando Gráficos de Barras
Ahora si lo que deseamos es crear gráficos de barras debemos incluir el archivo jpgraph_bar.php en lugar de jpgraph_line.php y luego podemos emplear la clase BarPlot. Veamos un ejemplo en el cual hemos cambiado el tipo de gráfico.

PHP:
  1. include("inc/jpgraph.php");
  2. include("inc/jpgraph_bar.php");
  3.  
  4. $ydata = array(11, 3, 8, 12, 5, 1, 9, 13, 5, 7);
  5. $graph = new Graph(350, 250, "auto");   
  6. $graph->SetScale("textlin");
  7.  
  8. $graph->img->SetMargin(40, 20, 20, 40);
  9. $graph->title->Set("JpGraph Demo");
  10. $graph->xaxis->title->Set("Altura" );
  11. $graph->yaxis->title->Set("Total" );
  12.  
  13. $barplot =new BarPlot($ydata);
  14. $barplot->SetColor("orange");
  15.  
  16. $graph->Add($barplot);
  17. $graph->Stroke();

Este ejemplo es semejante al primer ejemplo pero con unos pocos cambios hemos logrado obtener un gráfico de barras de la forma:


demo-bar.png

Conclusión
Definitivamente es un librería muy potente y que nos puede ayudar a generar gráficos de manera sencilla y rápida. Obviamente solo hemos visto un par de tipos de gráficos pero hay muchos mas tipos que están disponibles. Además de ello gracias a la excelente documentación que tiene no te será difícil aprender a utilizar los otros tipos de gráficos.

Posts Relacionados

Total de Comentarios: 29

Publicidad
26/10/2007
3:41 pm

[...] Para leer más: [...]

30/10/2007
10:33 am

[...] JpGraph una de las librerías mas completas para generar imágenes de la cual hemos hablado en JpGraph: Gráficos con PHP tiene entre una de sus características la de generar imágenes para hacer captcha. En esta ocasión veremos la forma de implementar un formulario que incluya verificación por captcha para protegerlo del ataque de los spammers. [...]

paolovaliente
12/11/2007
8:07 pm

como se puede hacer para poner un boton en la pagina justa del grafico…es que estoy haciendo una aplicacion y cuando pongo el codigo del boton despues del codigo php para crear un boton, no me lo carga…
pero la opcion dos, es como puedo hacer para poner al formulario que me abra la grafica en otra pagina?¿?¿?

paolovaliente
12/11/2007
8:25 pm

yo se que no es la mejor forma,,,pero mientras tanto,…cargue el grafico en una nueva pagina

04/12/2007
2:36 pm

muy buena la libreria, pero como puedo hacer para que los valores de Y salga en forma descendente, es decir en vez de empezar desde cero a n que empiece de n hasta cero.
ejemplo:
y= 0,1,2,3,4,5,6,7,8

yo quiero que sea:
y=8,7,6,5,4,3,2,1,0

se puede hacer?

Sergio Tejeda
05/12/2007
9:57 am

Que tal!! Buen día.

pormi parte es una de las mejores librerias, tanto en el diseño de las graficas como la informacion que se puede mostrar en ella. me gustaria saver si se pueden imprimir dos o mas gráficas en la misma pagina, presionando un botón. si esto es posible, les pediria el favor que me orientaran con estas acciones de antemano muchas gracias :)

10/12/2007
8:32 am

erwin me llamo : tengo una duda como hago para mostrar las cantidad de usuarios en la grafica :utilizando base de datos :porfavor mandar un ejemplo : real
porfa

Sergio Tejeda
12/12/2007
12:12 pm

que tal Erwind decarga los archivos de Captcha con PHP y JpGraph que estan al final de los ejemplos de estas graficas, hay vienen muchos ejemplos de este tipo que sugieres ;)

Sawachika
21/12/2007
3:00 pm

Hola, alguien sabra de alguna aplicación como esta pero que genere graficas tipo radar o tipo araña????

yop324
07/01/2008
3:18 am

Hola. He copiado el codigo y bajado las clases en el enlace que indica arriba. Cuando cargo la pagina en el explorador no me da ningun codigo de error (quiere decir que los includes estan bien puestos y que de codigo no ha problema), pero me sale la pagina en blanco. Alguien sabe porque puede ser y cual es la solucion. Muchas gracias.

yop324
18/01/2008
7:42 am

ya solucione el problema. Era relacionado con la libreria php_gd.dll

Ahora tengo otro problema jejeje.

Cuando lo que quiero es en vez de pasar un vector con los valores a mano, cogerlos de una base de datos, me dice: HTTP headers has already been sent… o algo asi.

No se como solucionarlo.
Alguien tiene un codigo que te saque la grafica a partir de datos de una base de datos.

Gracias

Ray Ronaldo Rivas Rodriguez
24/02/2008
7:36 pm

esto es exelente desearia por favor que me envien mas serca de php quisiera dominar este lenguaje y sus herramientas

16/04/2008
9:46 am

como hago los graficos tipo cienfico, donde pueda graficar funciones explicitas en dos ejes y=f(x)(por ejm: y=x^2+3)???

Javo
16/05/2008
8:24 pm

Y en vez de un array de ese tipo no podria ser una sentencia sql de una tabla?

patricio meneses
11/06/2008
8:26 pm

soy nuevo en esto y necesito su ayuda, no entiendo como pasarle los datos al grafico.

yo tegom una pagin en php en donde lee desde una base de datos acces, ahi nace mi duda como graficar los valores de la base. agradeceria me respondieran.

12/06/2008
4:06 pm

me gustaria saber si tambien puedo generar a partir de datos de una tabla, el grafico pero en imagenes ya existentes.
por ejemplo si tengo un mapa de un pais poder hacer que con los datos de la tabla, hacerlo cambiar.
saludos

Ruben
19/06/2008
6:10 am

Buenos días,
yop324dijo:
“ya solucione el problema. Era relacionado con la libreria php_gd.dll”.

a mi también me pasa lo mismo, alguien puede explicar que es exactamente ?

Edgar
24/06/2008
10:45 am

buenos dias, tendran un ejemplo de como usar php, jpgraph y ajax, es para graficar en tiempo real.. se los agradeceria mucho! saludos!

jesus
05/07/2008
6:11 pm

hola, segui todas las indicaciones para me indican para generar unas graficas con php pero solo me sale un cuadrito de imagen como que no existira la imagen. si alguien tiene idea del error que estoy cometiendo le agradeceria y me ayudara. hasta luego y gracias por su atencion.

Lipe
11/07/2008
10:57 am

me gustria saber si estas libresiar para utilizar graficos se puede usar en openbsd y que tengo que volver a configurar el archivo httpd.conf

Cristian
03/09/2008
4:07 pm

Una consulta se puede hacer un gráfico usando MySQL para el tratamiento de los datos?, si es un si alguien tiene una parte de código o una guía para entender más menos que pasos realizar.

Er_papa
26/09/2008
2:52 pm

Una duda, como podria poner una barra del diagrama de un color distinto del resto.

daniel
28/09/2008
8:33 pm

hola

quisiera saber como pouedo guardar la imagen, ya la genero, pero me gustaria guardarla temporalemte para poder guardar el gráfico en un archivo pdf.

me explico, le muestro la consualta al usuario, pero l doy la opción de que pueda guardarlo en una archivo pdf, como puedo hacerlo, utilizo la libreria FPDF pero ella me pide que ya exista la imagen en el disco duro, por eso no la puedo pasar al archico pdf.

gracias att Daniel

Priscy
09/10/2008
3:33 pm

hOLA YO TAMBIEN QUISIERA SABER COMO LLAMARLE DESDE EL FORM LE MANDO UN PERO NO ME MUESTRA LA IMAGEN. ADEMAS QUIERO SABER LA UBICACION EN LA QUE DEBO PONER LA LIBRERIA

Alexis
27/10/2008
2:25 pm

Hola.
Quisiera saber si en un gráfico de barras, una sola barra puede tener más de un color, ya que necesito que una misma barra muestre un total de varias cosas, que estan diferenciadas por colores.
Si me pudieras responder, muchas gracias.

Picky
28/10/2008
3:57 pm

Hola no entiendo las librerias me da miles de errores y no puedo probar ningun ejemplo:

Notice: Use of undefined constant IMG_PNG - assumed ‘IMG_PNG’ in /var/www/html/report/graficas/src/jpgraph_errhandler.inc.php on line 188
JpGraph Error Your PHP installation does not seem to have the required GD 2.x library enabled. Please see the PHP documentation, “Image” section. Make sure that “php_gd2.dll” statement is uncomment in the [modules] section in the php.ini file.

Antonias
07/11/2008
7:37 pm

para mostrar graficos con consultas a MySQL, simplemente se hacen llegar los datos o se hacen en la misma pagina las consultas, luego en html se llama al grafico como imagen.
osea si el archivo q genera el grafico se llama ‘Grafico.php’ en el html para mostrar el grafico es

JT
29/12/2008
1:42 pm

Necesito poder generar gráficos de barra o tortas pero que en cada barra pueda hacer referencia a un hipervínculo. Querría saber si este softwar o algún otro lo permite.
Gracias

20/01/2009
1:52 pm

hola tienen alguna web donde pueda ver el funcionamiento de este componente gracias

Enviar Comentario

(*)

(*)