junio 18, 2009 11

Gráficos en PHP con JpGraph. Parte II.

By in Librerías, PHP

Hoy vamos a ver como crear gráficos de barras. Empecemos con un sencillo ejemplo:

<?php
// Evita que se vean los errores
error_reporting(0);
include("include/jpgraph.php");
include("include/jpgraph_bar.php");
$datos1 = array(9, 5, 12, 11, 6, 10, 9, 11, 10, 4, 7, 3);
$grafico = new Graph(400, 300, "auto");
$grafico->SetScale("textlin");
$grafico->title->Set("Ejemplo JpGraph");
$grafico->xaxis->title->Set("Eje X");
$grafico->yaxis->title->Set("Eje Y");
$barplot1 = new BarPlot($datos1);
$barplot1->SetColor("red");
$barplot1->SetFillColor("red");
$grafico->Add($barplot1);
$grafico->Stroke();
?>

El gráfico quedaría tal cual:

Cuarto ejemplo con JpGraph

En este caso hemos usado la clase BarPlot, en lugar de la LinePlot de los anteriores ejemplos, para generar el gráfico de barras. En esta ocasión vemos que se llama a un método de la clase BarPlot llamado SetFillColor. Este método se usa para asignar el color de fondo de las barras. Existe otro método llamado SetFillGradient que nos permite realizar el relleno de las barras mediante un gradiente. Podemos también controlar el ancho de las barras con el método SetWidth. Vamos a ver esto último con un ejemplo:

<?php
// Evita que se vean los errores
error_reporting(0);
include("include/jpgraph.php");
include("include/jpgraph_bar.php");
$datos1 = array(9, 5, 12, 11, 6, 10, 9, 11, 10, 4, 7, 3);
$grafico = new Graph(400, 300, "auto");
$grafico->SetScale("textlin");
$grafico->title->Set("Ejemplo JpGraph");
$grafico->xaxis->title->Set("Eje X");
$grafico->yaxis->title->Set("Eje Y");
$barplot1 = new BarPlot($datos1);
$barplot1->SetColor("red");
// Un gradiente Horizontal de rojo a azul
$barplot1->SetFillGradient("red", "blue", GRAD_HOR);
// 25 pixeles de ancho para cada barra
$barplot1->SetWidth(25);
$grafico->Add($barplot1);
$grafico->Stroke();
?>

El gráfico sería:

Quinto ejemplo con JpGraph

También podemos combinar gráficos, como por ejemplo uno de barras con uno de lineas, como en el ejemplo siguiente:

<?php
// Evita que se vean los errores
error_reporting(0);
include("include/jpgraph.php");
include("include/jpgraph_bar.php");
include("include/jpgraph_line.php");
$datos1 = array(9, 5, 12, 11, 6, 10, 9, 11, 10, 4, 7, 3);
$datos2 = array(5, 7, 1, 11, 13, 4, 9, 6, 12, 7, 1, 4);
$grafico = new Graph(400, 300, "auto");
$grafico->SetScale("textlin");
$grafico->title->Set("Ejemplo JpGraph");
$grafico->xaxis->title->Set("Eje X");
$grafico->yaxis->title->Set("Eje Y");
$barplot1 = new BarPlot($datos1);
$barplot1->SetColor("red");
// Un gradiente Horizontal de rojo a azul
$barplot1->SetFillGradient("red", "blue", GRAD_HOR);
// 25 pixeles de ancho para cada barra
$barplot1->SetWidth(25);
$lineplot = new LinePlot($datos2);
$lineplot->SetColor("green");
$lineplot->SetWeight(2);
$grafico->Add($barplot1);
$grafico->Add($lineplot);
$grafico->Stroke();
?>

Que quedaría de la siguiente manera:

Sexto ejemplo con JpGraph

Con esto es todo por hoy. Para finalizar y por no faltar a la costumbre os dejo aquí los archivos con los ejemplos del artículo:

Ejemplos con JpGraph. Parte II.

ACTUALIZACIÓN 2012-12-05

Se ha añadido al código una linea de código que desactiva el reporte de errores de PHP. Esto se debe a que la versión de jpGraph para PHP 4 produce errores en versiones de PHP 5, que provocan que las imágenes generadas no se vean bien.

Todos los ejemplos de este artículo y de los demás artículos sobre jpGraph los podéis encontrar en gitHub, en el siguiente repositorio:

https://github.com/mjcarrascosa/jpGraphDemo

Comparte esta entrada:
Delicious Digg Google Technorati Menéame Fresqui Reddit Facebook Twitter Yahoo! Buzz MySpace Email BarraPunto

Tags: , , , ,

11 Responses to “Gráficos en PHP con JpGraph. Parte II.”

  1. comunitario dice:

    Gracias por el tutorial, de mucha ayuda.
    Y para cambiar los datos que aparecen en el eje x, es decir, reemplazarlo por algo como los mese del año, ¿Que se debe hacer?

  2. comunitario dice:

    Escribir los meses del año en el eje x quedó solucionado de la siguiente forma:
    $meses = array(‘Ene’,’Feb’,’Mar’,’Abr’,’May’);
    $grafico->xaxis->SetTickLabels($meses);

    Pero ahora quiero saber como hago para poner dos barras por cada mes del eje x, algo asi como Enero -> Barra 1: Hombres – Barra 2: Mujeres.

    Muchas gracias.

  3. Manuel Jesús Carrascosa de la Blanca dice:

    Pues no estoy muy seguro de como hacerlo, pero tal vez se puedan agrupar los datos de alguna manera. Me pondré a investigarlo.

  4. No he averiguado como hacer eso exactamente, pero puede que te sea útil la clase GroupBarPlot. Aquí hay información sobre ella:

    http://www1.sdu.dk/jpgraph/doc/manual/3030barplot.html

  5. wilsot dice:

    buenas noches como se puede capturar en una grafica con jpgraph unos datos ingresados en un formulario???? los datos pueden variar y luego debe mostrarlos de manera estadisitca en uno de los graficos…gracias

  6. Hola willsot, dependería mucho de como quieras mostrar los datos y de como sean estos. Pero por ejemplo se me ocurre que tengas lo siguiente:

    1-. Un formulario (ej: formulario.php) donde se ingresen los datos y que al aceptar, por ejemplo, se vaya a un script (script.php) que nos los muestre, en forma de tabla o como porceda.
    2-. En los resultados además habrá una etiqueta img que cargue un script (ej: grafico.php) al que se le pasarán mediante GET los datos, segun la complejidad de estos se podrán usar disitintas formas para pasarselos.

    Un saludo.

  7. Juan dice:

    Buenas,Tengo una inquietud:Como se hace para graficar datos a través de un formulario de busqueda y los resultados que arroje sean los que se grafiquen?Gracias

  8. Sergio dice:

    Saludos¿Cómo logro dejar un gráfico dentro de una tabla HTML?

  9. Ary dice:

    Hola ya hace mucho de esta publicacion pero he andado vuscando y no encuentro nada sobre como quitar el fondo negro que se pone por default y tambien si me puedes asesorar en otra duda cando trata de mostrar otrs datos  debajo o antes de la grafica ya no los muestra sabes como puedo hacer para que el echo se vea. gracias y saludos.

  10. Sergio dice:

    Consulta… En un gráfico de líneas como hago para centrar el CERO en el medio y que no se mueva mas arriba o mas a bajo? Cómo puedo hacer para que las etiquetas o labels se muestren debajo de todo y no debajo de la línea del medio. Se puede mostrar en cada ángulo de las líneas su valor? Gracias! 

Leave a Reply