NOTA: AL momento de re-escribir este artículo, me entere de la nueva versión de la librería con soporte total para PHP5 y nuevos tipos de gráficas, aún así, no ha cambiado en sus funciones básicas que son las que se explican aquí.

LibChart es es una líbrería orientada a objetos de libre distribución y facilidad de uso que te ahorrara la difícil tarea de crear gráficas en tus aplicaciones Web. Todo lo que tienes que hacer, es bajarte la librería, instalarla en tu aplicación y empezar a usarla. Entremos en detalle.

Instalar la librería

Después de descargar la librería, es necesario que está se descomprima y se coloque en un subdirectorio de nuestra aplicación, en mi caso, le he dejado el nombre de la librería a la carpeta, solo para recordar que estoy haciendo.

Una vez subidos los archivos, deberás hacer lo siguiente:

• Otorga el permiso 555 a la carpeta que acabas de subir
• crea dentro de esa carpeta una subcarpeta donde se van a guardar las gráficas (se generan en formato .PNG) y ponle los atributos 777 (siempre puedes jugar con los permisos), en mi caso, le puesto demo como nombre a la carpeta

Creando gráficos

Al momento, LibChart, soporta gráficas de barras horizontales y verticales, circulares y gráficas de líneas, así que tendremos que elegir cual vamos a crear, pero primero, en nuestras aplicaciones, incluyamos la librería correspondiente (ver la nota el inicio de este artículo).

Recordemos que debemos apuntar al nombre que le hayamos puesto a la carpeta de nuestra librería. Con eso ya tenemos incluida la librería, ahora vemos como crear una gráfico de barras horizontal

Con barra verticales

Circular o de pastel

Líneal

Se ve bastante fácil, por cierto, los parametros numéricos representan ancho y alto respectivamente, $ chart es el nombre que le hemos dado a nuestra variable la cual se deriva de las clases LineChart, VerticalChart, HorizontalChart y PieChart; lo siguiente, es añadir por supuesto el contenido de la gráfica.

addPoint es un método que consiste en agregar un punto a nuestra gráfica, se instancia de la Clase Point, e incluye, el título entre comillas y el valor necesario para poder representarlo, lo que quiere decir que podemos agregar tantos puntos como datos necesitemos representar. Ahora, como ya tenemos los datos, es importante colocarle un título a nuestra gráfica, de otra forma ¿cómo sabremos que estamos ilustrando? setTitle se encarga de ello

Ahora que ya tenemos todo completo, hay que renderizar el gráfico y que se genere el archivo .png con nuestra gráfica

El método render le dice a donde vamos a depositar la gráfica, es importante como mencione al inicio que el directorio donde vamos a poner las gráficas generadas tenga el permiso 777 o 775, se que para los paranoicos de la seguridad esto es inaudito, pero vamos, hay mecanismos para ello, una recomendación es que no pongan sus gráficas sobre la raíz de su servidor sino quieren llevarse sorpresas desagradables (por aquello de los hackers, crakers, lammers, script kiddies, etc). Lo último que queda por hacer, es simplemente mostrar la gráfica en nuestra aplicación, lo haré de la forma más sencilla posible

Nada del otro mundo, ¿eh? si todo salió bien, ya tienen un perfecto sistema de generación de gráficas. Veamos el código completo de una gráfica y su visualización.

Y las bases de datos, ¿qué?

Sabía que se lo preguntarían, suponiendo que ya tenemos todo el código para la conexión de una base de datos, podemos tomar un ejemplo sencillo de como gráficar datos de alumnos de una determinada escuela.

Cuyo resultado sería:

¡Espero que les haya sido de utilidad!