Gráficos em PHP Highcharts

Mostrarei como criar um gráfico gratuitamente usando PHP e Highcharts. Highcharts é uma ferramenta criada em Javascript, onde você determina os valores e coordenadas em arrays dentro do código e ele cria um gráfico simples e elegante com as informações desejadas.

[ Hits: 49.558 ]

Por: Fagner Fjas em 08/06/2010 | Blog: https://fjas.com.br


Organizando os dados



Para colocar as informações não é muito complicado, basta criar uma linha com os dados separados por vírgula (,), as strings geralmente são expressas com aspas ('). Exemplo:

xAxis: {

   categories: [ 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday' ]

   series: [ { name: 'John', data: [3, 4, 3, 5, 4, 10, 12] },
            { name: 'Jane', data: [-1, 3, 4, 3, 3, 5, 4] } ]
}

Então agora é só usar o PHP para organizar os dados em array e depois jogar dentro do código Javascript. No meu caso, todas as informações estão em banco de dados. A conexão com banco de dados está embutida em uma função que não vem ao caso.

class recargas
{
   public $table;
   function selectdb()
   {
      conectdb(); // CONEXÃO COM BANCO DE DADOS
      $r_query = mysql_query('select * from recarga where data like "%'. date('m/Y') .'" order by operador'); // QUERY DA CONSULTA DO BANCO DE DADOS.
      $n=0;
      $m=0;
      while($r_lista = mysql_fetch_array($r_query))
      {

         if($r_lista[10] != $ja_visto)
         {
            $first_name = explode(' ', $r_lista[10]);
            echo '\' '. $first_name[0] . ' '. $r_lista[5] .'\' ,';   // IMPRIME OS VALORES EM LISTA (1)
            $ja_visto = $r_lista[10];
            // GRAFICO
            $r_query_valor = mysql_query('select sum(vlr_recarga) from recarga where data like "%'. date('m/Y') .'" and nome_operador="'. $r_lista[10] .'" order by nome_operador');
            while($r_lista_valor = mysql_fetch_array($r_query_valor))
            {
               $this -> lista_valores[$n] = $r_lista_valor[0] ;   // PEGA OS VALORES E GERA UM ARRAY PRA SER IMPRESSO EM OUTRA FUNÇÃO
               $n = $n + 1;
             }
         }
      }
   }

   function mostra_valor()
   {
      $valores = $this -> lista_valores;
      for($i=0; $i<=count($valores); $i++)
      {
         echo $valores[$i] .', '; //IMPRIME OS VALORES DO ARRAY CRIADO NA FUNÇÃO ACIMA.
      }
   }
}

Os códigos acima representam a maneira que utilizei pra organizar os dados no formato necessário. A primeira função "function selectdb()" faz a consulta no banco de dados e organiza as informações da seguinte forma:

' Faciene 8' ,' JULIANA 10' ,' ELTON 11' ,' JULIMARY 12' ,' ... ... , 'GILMARIO 95'

A segunda função "mostra_valor()", mostra os valores:

12.00, 85.00, 235.00, 10.00, 68.00, 453.00, 74.00, 109.00, 114.00, 148.00, ... ... 148.00, 128.00, 109.00

Falta apenas colocar essas funções dentro do código JavaScript e colocar o gráfico pra funcionar.

Página anterior     Próxima página

Páginas do artigo
   1. Início
   2. Organizando os dados
   3. Colocar as informações no gráfico
Outros artigos deste autor

Gedit - Um bom editor pra programar em PHP!

Leitura recomendada

Migração de dados no Joomla

A simples classe Date Operations

Entendendo o que é URI, URL, URN e conhecendo as diferenças entre POST e GET

Solução open source para clínicas médicas

JOOMLA no openSUSE em 10 passos

  
Comentários
[1] Comentário enviado por removido em 08/06/2010 - 17:55h

Muito interessate. Pode ser usado com outras linguagens web ?

[2] Comentário enviado por lucasvegi em 08/06/2010 - 19:05h

Muito interessante. Por acaso estava precisando de algo equivalente a tecnologia que você apresentou e me caiu feito uma luva.

[3] Comentário enviado por fagnerfjas em 09/06/2010 - 09:21h

Respondendo ao Ilsahec:
Pode sim ser usado em qualquer outra linguagem, basta criar alguns arrays contendo os valores, e depois ordenar como foi explicado no artigo.

[4] Comentário enviado por Lisandro em 09/06/2010 - 09:27h

Parabéns pelo belo artigo!

[5] Comentário enviado por ottodutra em 30/07/2010 - 11:41h

Cara, ótimo artigo. Estas informações são importantíssimas para quem programa com ferramentas free. E nota-se que existem ótimos recusrosos free, é só pesquisar e as vezes contar com pessoas como você que divulgam estas ferramentas.

Valeu.

[6] Comentário enviado por fagnerfjas em 03/08/2010 - 02:52h

:) eu galera value mesmo pelos elogios, fico grato e até sem jeito mas isso me incentiva a escrever mais coisas no VOL!!!!

[7] Comentário enviado por f.rodrigues em 14/05/2012 - 10:31h

Bom dia

Meu nome é Fagner e sou iniciante em PHP, preciso fazer um grafico mas que busque as informações do banco,
Ex: Demontrativo de Mensal de valores - JAN - FEV, MAR... 100 / 200 / 400...

Esse exemplo puxa as informações do banco?

[8] Comentário enviado por fagnerfjas em 15/05/2012 - 10:46h

Sim, se você olhar na 2ª página do artigo, pode ver no cócigo há uma consulta no banco de dados pra pegar todas as informações necessária pra montar o gráfico,
mas quanto ao seu script você terá que refazer, pra pegar as informações relevantes ao seu sistema e organizar de acordo como pede o script do grafico.

mas esse artigo acho que cai como luva pra vc.

[9] Comentário enviado por nando_tecnologia em 17/09/2012 - 23:52h

Fagner estou tentando inserir um array utilizando o metodo que vc me repassou mas ele não reconhece. Alguma dica? Meu array está sendo exibido 'Fernando','Maria','João', mas mesmo assim quando passo para dentro do javascript não aparece o grafico.

Abraço,


Contribuir com comentário




Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts