Criando gráficos com a classe JPGraph (parte 1)

Leituras: 20272 -

Introdução

A linguagem PHP, quando utilizada em conjunto com a biblioteca GD nos oferece uma infinidade de recursos para criar e manipular imagens,sendo possível criar desenhos vetoriais, thumbnails, manipular imagens prontas, dentre outros.

O código abaixo cria uma imagem de 150x100 pixels com o fundo em tonalidade amarela e desenha uma linha preta cortando o gráfico:

<?
header ("Content-type: image/png");
$imagem = imagecreate (150, 100);
$corFundo = imagecolorallocate ($imagem, 255, 255, 200);
$corLinha = imagecolorallocate ($imagem, 0, 0, 0);
imageline ($imagem, 10, 90, 140, 10, $corLinha);
imagepng ($imagem);
?>

Figura 01

Como pode-se notar, os comandos são relativamente intuitivos, porém criar uma imagem de estrutura mais complexa pode ser uma tarefa bastante dolorosa.Imagine criar um sofisticado gráfico de pizza a partir do zero ? Para nossa sorte existem classes PHP de terceiros que facilitam nossa vida e é sobre isso que vou falar nesse artigo. Hoje seremos apresentados à classe jpgraph da PHP, usada para criar quaisquer tipo de gráfico imaginável.

Obtendo e instalando a classe jpgraph

Antes de mais nada você precisa fazer o download da classe a partir de sua página oficial através da URL:

www.aditus.nu/jpgraph

Ao clicar no link para download, será recebido o arquivo jpgraph-x.x.tar.gz,onde x.x corresponde à versão do programa. Descompacte o arquivo com o comando:

$ tar -zxvf jpgraphx.x.tar.gz

O comando acima criará o diretório jpgraph-x.x com a seguinte estrutura de diretórios:

./src arquivos da classe jpgraph
./docs manual de uso
./README instruções detalhadas sobre instalação
./QPL.txt cópia da licença QPL

Você tem duas opções ao utilizar os arquivos da classe em seus scripts:

• Copiar todos os arquivos de ./src para o diretório onde se encontram seus scripts
• Copiar os arquivos de ./src para um diretório definido no include_path do seu arquivo de configuração do PHP (php.ini)

Sem dúvidas a segunda alternativa é melhor, sendo assim vamos criar um diretório de inclusão e copiar os arquivos para lá:

$ mkdir /usr/local/jpgraph
$ cp jpgraphx.x/src/* /usr/local/jpgraph

Edite o arquivo php.ini (geralmente em /etc/php4/apache/php.ini) e inclua o novo diretório em seu path:

include_path = ".:/usr/local/jpgraph"

Ao reiniciar o Apache a classe jpgraph estará instalada.

Nota: o software é distribuído sob licença QPL, que é uma variação da GPL com algumas restrições. O software continua sendo livre, mas é bom dar uma lida no arquivo QPL.txt distribuído junto com o mesmo para se manter bem informado.

Criando gráfico de barras

Em nosso primeiro exemplo prático vamos criar um simples gráfico de barras. Tenho um time de futebol de botão de mesa e quero botar em gráfico o número de gols que o time marcou durante a semana.

<?
// exemplo1.php
// fazer uso da classe jpgraph padrão e sua especialização
// em gráfico de barras
include ("jpgraph.php");
include ("jpgraph_bar.php");

/*
Definir um array para cada ponto da coordenada Y, especificando
seus pontos/valores, sendo:
$numGols = o número de gols marcados em cada dia da semana,
começando Domingo (8 gols) e terminando Sábado (11 gols)
*/
$numGols = array ("8", "7", "12", "10", "7", "9", "11");

// iniciar criação do gráfico
$grafico = new graph(350,200,"png");

// ajustar alguns parâmetros
$grafico->SetScale("textlin");
$grafico->SetShadow();

$grafico->title->Set('Viva o Linux Futebol Clube');

// criar o gráfico de barras
$gBarras = new BarPlot($numGols);

// ajuste de cores
$gBarras->SetFillColor("orange");
$gBarras->SetShadow("darkblue");

// adicionar gráfico de barras ao gráfico
$grafico->Add($gBarras);

// imprimir gráfico
$grafico->Stroke();

?>

Figura 02 - um simples gráfico de barras

Se você deseja utilizar esse gráfico numa página HTML, basta fazer sua referência a partir de uma tag img:

<img src="exemplo1.php">

Sofisticando o seu gráfico de barras

Agora que estamos aptos à criar nosso primeiro gráfico de barras,vamos sofisticar nosso gráfico com alguns add-ons como o nome dos dias da semana, label dos vértices, etc. Vamos aproveitar o primeiro exemplo adicionando novas linhas e comentando-as.

<?
// exemplo2.php
include ("jpgraph.php");
include ("jpgraph_bar.php");

$numGols = array ("8", "7", "12", "10", "7", "9", "11");
// definir dias da semana
$diasSemana = array("Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sáb");

$grafico = new graph(350,200,"png");

// margem das partes principais do gráfico (dados), o que está
// fora da margem fica separado para as labels, títulos, etc
$grafico->img->SetMargin(40,40,40,40);

$grafico->SetScale("textlin");
$grafico->SetShadow();

$grafico->title->Set('Viva o Linux Futebol Clube');
// definir sub-titulo
$grafico->subtitle->Set('www.vivaolinux.com.br');

// pedir para mostrar os grides no fundo do gráfico,
// o ygrid é marcado como true por padrão
$grafico->ygrid->Show(true);
$grafico->xgrid->Show(true);

$gBarras = new BarPlot($numGols);
$gBarras->SetFillColor("orange");
$gBarras->SetShadow("darkblue");

// título dos vértices
$grafico->yaxis->title->Set("Gols");
$grafico->xaxis->title->Set("Dia da semana");
// título das barras
$grafico->xaxis->SetTickLabels($diasSemana);


$grafico->Add($gBarras);
$grafico->Stroke();
?>

Figura 03 - gráfico de barras sofisticado

Gráfico de barras agrupado

Agora me surgiu a necessidade de definir a quantidade de gols sofridos no mesmo gráfico, será que vai ficar legal ? Claro que vai, meu saldo de gols está positivo. Ou seja, o que seriam dois gráficos separados,o de gols marcados e gols sofridos passará a ser apenas um. Vou criar o gráfico normalmente e adicionar mais um gráfico de barras no mesmo.Vamos reutilizar o código do último exemplo e comentar as novas linhas adicionadas. Let's work!

<?
// exemplo4.php
include ("jpgraph.php");
include ("jpgraph_bar.php");

$numGols = array ("8", "7", "12", "10", "7", "9", "11");
// definir um array com o número de gols sofridos
$numGolsSofridos = array("3", "4", "13", "9", "1", "5");

$diasSemana = array("Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sáb");

$grafico = new graph(350,200,"png");
$grafico->img->SetMargin(40,40,40,40);
$grafico->SetScale("textlin");
$grafico->SetShadow();

$grafico->title->Set('Viva o Linux Futebol Clube');
$grafico->subtitle->Set('www.vivaolinux.com.br');
$grafico->ygrid->Show(true);
$grafico->xgrid->Show(true);

$gBarras = new BarPlot($numGols);
$gBarras->SetFillColor("orange");
$gBarras->SetShadow("darkblue");
// com a função SetLegend estamos automaticamente criando uma legenda
// para o gráfico
$gBarras->SetLegend("Gols marcados");

// criar mais um gráfico de barras para o número de gols sofridos
$gBarras2 = new BarPlot($numGolsSofridos);
$gBarras2->SetFillColor("red");
$gBarras2->SetShadow("darkblue");
$gBarras2->SetLegend("Gols sofridos");

$grupoBarras = new GroupBarPlot(array($gBarras,$gBarras2));
$grafico->Add($grupoBarras);

$grafico->yaxis->title->Set("Gols");
$grafico->xaxis->title->Set("Dia da semana");
$grafico->xaxis->SetTickLabels($diasSemana);


$grafico->Stroke();
?>

Figura 04 - gráfico de barras agrupado

Como vocês podem ver, criar belos gráficos em PHP é moleza, ponto para a comunidade de desenvolvedores que apoiam a iniciativa do software livre. No site oficial do jpgraph o autor cita que aceita donativos caso o software seja útil à sua empresa. Assim que eu angariar recursos em trabalhos baseados nessa classe não terei dúvidas ao depositar uma quantia simbólica como forma de agradecimento.

No próximo artigo veremos como criar gráficos de pizza, linhas e alguns recursos adicionais.

Atenciosamente,
Fábio Berbert de Paula
fabio@vivaolinux.com.br

A linguagem PHP nos oferece uma infinidade de recursos para criar e manipular imagens, porém criar uma imagem de estrutura mais complexa pode ser uma tarefa bastante dolorosa. Para nossa sorte existem classes PHP de terceiros que facilitam nossa vida e é sobre isso que vamos falar nesse artigo. Seremos apresentados à classe JPGraph da PHP, usada para criar quaisquer tipo de gráfico imaginável.