Estás en: Principal > Productos > GDGraph 2.1 Versión en Español

GDGraph 2.1 Versión en Español

Check the english version of this document.

Este documento provee una referencia del uso de GDGraph 2.1. Para iniciar, primero necesitas PHP 4.3 o superior y GD 2 o superior.

Esta clase regresa una imagen PNG después de llamar alguna de sus funciones (bar_graph, pie_graph o line_graph), incluyendo su cabecera (para no tener que utilizar una cabecera PHP cada vez que se procesa una imagen).

Esta librería es distribuida bajo GPL, cuyo texto debe ser incluido en el archivo GNU Public License.txt dentro del paquete de descarga.

Cualquier comentario es bienvenido en la dirección gdgraph (at) makko.com.mx o mediante la forma de contacto.

Contenido

Constructor

GDGraph(width, height [, title [, red_bg [, green_bg [, blue_bg [, red_line [, green_line [, blue_line [red_font [, green_font [, blue_font [, legend [, legend_x [, legend_y [, legend_border [, transparent_background [, line_thickness]]]]]]]]]]]]]]]]);

ArgumentoTipoExplicaciónPor defecto
width,height int Ancho y alto de imagen. Requeridos
title string Titulo de la gráfica. En blanco
red_bg,green_bg, blue_bg int [0-255] Componentes de rojo, verde y azul del color del fondo de la gráfica. 255,255,255 (Blanco)
red_line, green_line, blue_line int [0-255] Componentes de rojo, verde y azul del color de las líneas. 0,0,0 (Negro)
red_font, green_font, blue_font int [0-255] Componentes de rojo, verde y azul del color de la tipografía. 0,0,0 (Negro)
legend boolean Si se quiere poner una leyenda. True
legend_x, legend_y int [0-width, 0-height] Posición en X y Y de la leyenda, si está presente (0,0 es esquina superior izquierda). Esquina superior derecha
legend_border boolean Si se quiere un poner un borde alrededor de la leyenda. True
transparent_background boolean

Si se quiere hacer el fondo transparente

Ya que GDGraph utiliza imágenes PNG para pintar las gráficas, e Internet Explorer 6 no maneja transparencia en archivos PNG, esta opción no funciona en Internet Explorer 6 (en la versión 7 sí). No lo vamos a hacer que funcione hasta que Microsoft adquiera conciencia y añada esta funcionalidad en la versión 6.

Esta bienvenido a cambiar las líneas 526 y 527, 839 y 840, y 944 y 945 del archivo gdgraph.php a lo siguiente:

header('Content-type: image/gif');

imagegif($this->image);

Esto hará que GDGraph entreue una imagen GIF (en vez de PNG) con el que Internet Explorer 6 sí puede manejar transparencia. Pueden culpar a Microsoft por esta molestia.

False
line_thickness int El grosor del eje X, Y, and líneas cuadriculares en pixeles. 1

Bar Graph

bar_graph(data[, x_title [, y_title [, bar_width_percentage [, grid_presence [, bar_border_presence]]]]]);

Regresa

Una imagen PNG con una gráfica de barras con la representación de los datos contenidos en data.

ArgumentoTipoExplicaciónPor defecto
data array

Los datos con los que la gráfica se va a crear.

Formato:

Array( 'bar1' => Array(value1,red1,green1,blue1,3d1), 'bar2' => Array(value2,red2,green2,blue2,3d2), ... );

Donde bar1 es el nombre de la primera barra, value1 es su valor; red1, green1 y blue1 son su componentes de color y 3d1 es su grosor en 3D (estos últimos cuatro se pueden omitir recayendo en el valor de 0).

Requerido
x_title, y_title string El título de los ejes X y Y. En blanco
bar_width_percentage int [0-100] Porcentaje que va ocupar una barra del espacio dirigido a ella. 90
grid_presence int [0-10] Presencia de la cuadrículla, 0 indicando completa ausencia y 10 indicando una línea contínua (ver Ejemplo 2 para una explicación má detallada). 0
bar_border_presence boolean Presencia de un borde alrededor de las barras. True

Ejemplo 1

<?php
	require_once("gdgraph.php");
	$gdg = new GDGraph(500,300,"Sales");
	$arr = Array(
		'First Trimester' => Array(1000,200,100,1000,50),
		'Second Trimester' => Array(1200,200,200,10,20),
		'Third Trimester' => Array(-500,23,255,100,15)
	);
	$gdg->bar_graph($arr);	//Línea A
?>

Presentará la siguiente imagen:

salida del ejemplo 1

Ejemplo 2

Al cambiar la línea A a

$gdg->bar_graph($arr,“$”, “Trimesters”, 20, 5, false); //Línea A

Entrega la siguiente imagen:

salida del ejemplo 2

Pie Graph

pie_graph(data [, pie_fill_percentage [, pieces_labels [, starting_degree [, outline [, 3D_thickness]]]]]);

Regresa

Una imagen PNG con una gráfica de pay presentando la información contenida en data.

ArgumentoTipoExplicaciónPor defecto
data array

Los datos con los que la gráfica será creada.

Formato:

Array('pie1'=>Array(value1,red1,green1,blue1), 'pie2'=>Array(value2,red2,green2,blue2),...);

Donde pie1 es el nombre de la primera rodaja, value1 es su valor, y red1, green1 y blue1 son sus componentes de color (estos últimos tres se pueden omitir recayendo en el valor de 0).

Todos los valores (value1, value2, etc.) son absolutos, por lo que no tienen que ser porcentajes, GDGraph los normaliza automáticamente.

Requerido
pie_fill_percentage int [0-100] Porcentaje de la imagen ocupada por la gráfica. 100
pieces_labels boolean Si quiere poner los nombres de las rodajas sobre ellas. True
starting_degree int El punto (en grados) en que la grá se comenzará a dibujar. 0
outline boolean Si quiere un borde alrededor de las rodajas. True
3D_thickness array

El grosor de cada rodaja.

Formato:

Array('pie1'=> thick1, 'pie2' => thick2,...);

Donde pie1 es el nombre de la primera rodaja y thick1 es su grosor en pixeles.

0 para cada rodaja omitida

Ejemplo 1

<?php
	require_once("gdgraph.php");
	$gdg = new GDGraph(500,300,"Sales");
	$arr = Array(
		'First Trimester' => Array(1000,200,100,1000),
		'Second Trimester' => Array(1200,200,200,10),
		'Third Trimester' => Array(500,23,255,100)
	);
	$gdg->pie_graph($arr);	//Línea A
?>

Presentará la siguiente imagen:

salida del ejemplo 1

Ejemplo 2

Al agregar lo siguiente antes de la línea A:

$arr_3D = Array(
	'First Trimester' => 15,
	'Second Trimester' => 0,
	'Third Trimester' => 5
);

Y cambiar la línea A a:

$gdg->pie_graph($arr,90,false,200,false,$arr_3D);	//Línea A

La imagen cambia así

salida del ejemplo 2

Line Graph

line_graph(data [, colors [, x_labels [, x_title [, y_title [, paint_dots [,lines_thickness [, x_lower_value [, x_upper_value [, y_lower_value [, y_upper_value]]]]]]]]]]);

Regresa

Una imagen PNG con una gráfica de líneas presentando la información contenida en data

ArgumentoTipoExplicaciónPor defecto
data array

Los datos con los que la gráfica será creada.

Formato:

Array(=> Array(t1,t2,t3,t4,t5,t6,t7, ...), 'lin2' => Array(t1,t2,t3,t4,t5,t6,t7, ...), ...);

Donde lin1 es el nombre del primera línea, y t1, t2, t3, etc. son sus valores a través del tiempo. Obviamente, todas las líneas deben tener el mismo número de t's; si no, solamente dibujará una línea aparentemente incompleta.

Requerido
colors array

Color de cada línea.

Formato:

Array('lin1' => Array(red1,green1,blue1), 'lin2' => Array(red2,green2,blue2),...);

Donde lin1 es el nombre de la primera línea, y red1, green1, y blue1 son sus componentes de color.

0 para cada línea omitida. Sin embargo, cada línea omitida tampoco será mostrada en la leyenda.
x_labels array

Etiquetas para los valores en el eje X.

Formato:

Array('t_label1','t_label2', ...);

Donde todos los t_label's son las etiquetas de su correspondiente t en data, contando de izquierda a derecha.

Si no se incluyen, el eje X no tendra etiquetas.
x_title, y_title string Los títulos de los ejes X y Y. En blanco
paint_dots boolean Si se quiere pintar un pequeño recuadro en cada quiebre de las líneas. True
lines_thickness array

Grosor de cada línea.

Formato:

Array( 'lin1' => thick1, 'lin2' => thick2, ...);

Donde lin1 es el nombre del primera línea, y thick1 es su grosor.

1 por cada línea omitida.
grid_presence int [0-10] Presencia de la cuadrículla, 0 indicando completa ausencia y 10 indicando una línea contínua (ver Ejemplo 3 para una detallada explicación). 0
x_lower_value,x_upper_value, y_lower_value, y_upper_value int Area zoom. Si estos valores son NULL, GDGraph los substituirá como los valores mínimos y máximos en el eje X y/o Y. Si alguno no es NULL, GDGraph utilizará el verdadero mínimo o máximo encontrado en data. Para el eje X, no se permiten valores negativos, y el eje comienza en 0. Favor de ver el Ejemplo 3 para una detallada explicación. NULL (automático)

Ejemplo 1

<?php
	require_once("gdgraph.php");
	$gdg = new GDGraph(500,300,"Sales");
	$arr = Array(
		'First Trimester' => Array(1000,2000,-1000,1500),
		'Second Trimester' => Array(-1000,0,500,-200),
		'Third Trimester' => Array(500,23,255,100)
	);
	$colors = Array(
		'First Trimester' => Array(50,50,50),
		'Second Trimester' => Array(250,100,100),
		'Third Trimester' => Array(50,255,0)
	);
	$x_labels = Array('January','February','March','April');
	$gdg->line_graph($arr,$colors, $x_labels); //Línea A
?>

Entregará:

salida del ejemplo 1

Ejemplo 2

Agregando lo siguiente a la línea A:

$thicknesses = Array(
	'First Trimester' => 10,
	'Second Trimester' => 6,
	'Third Trimester' => 3
);

Y cambiar la línea A a:

$gdg->line_graph($arr,$colors, $x_labels,"Trimesters","$", false,$thicknesses, 5); //Línea A

La imagen cambia a:

salida del ejemplo 2

Ejemplo 3

Cambia la línea A a:

$gdg->line_graph($arr,$colors,$x_labels,"Trimesters","$",false,$thicknesses,5,0,2,-900,900); //Línea A

Y el resultado será éste:

salida del ejemplo 3