Gráficos em PHP Highcharts

fagnerfjas

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: 50.056 ]

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

1 0

Denuncie Favoritos Indicar Impressora

Colocar as informações no gráfico

A escolha do gráfico deverá ser feita observando os tipos de informações que serão expressas, pois há vários modelos diferentes, e alguns desses têm peculiaridades que mostram de um modo diferente cada grupo de valor.

Um exemplo disso são os gráficos combinados, que apesar de terem uma estrutura bonita e formar um estilo interessante, não convém ser usado para exibir informações diretas e simples, com notas de alunos por bimestre, seria melhor usar em estruturas de dados mais complexas, como venda e rentabilidade relacionadas com datas e produtos. Não quero dizer que seja impossível de usar o gráfico que quiser da maneira que quiser, mas sim que dependendo da maneira que vá utilizá-lo deverá fazer algumas modificações no código em java script.

Segue abaixo um exemplo de como expressei o código, isso deve ser feito em um dos arquivos da pasta "exemples", lembrando que cada um dos arquivos faz referência a um tipo de gráfico diferente:

<?php
$recargas = new recargas; // CHAMA O OBJETO COM AS FUNÇÕES
?>
<script type="text/javascript">
$(document).ready(function() {
   var chart = new Highcharts.Chart({
      chart: {
         renderTo: 'container',
         defaultSeriesType: 'bar'
      },
      title: {
         text: 'Ranking de Recargas por Operador'
      },
      subtitle: {
         text: 'OPERADORES: <? selectdb()  //FUNÇÃO QUE MOSTRA O NOME DOS OPERADORES ?>'
      },
      xAxis: {

         categories: [<? mostra_valor() //FUNÇÃO QUE RETORNA O VALOR DOS OPERADORES ?>],
         title: {
            text: null
         }

Esse código é apenas um exemplo de como fiz o uso do PHP para montar um gráfico com os dados que tinha registrado num banco de dados, as informações são inseridas dinamicamente com o php, a cada vez que os dados do banco são alterados, o gráfico muda automaticamente.

Para finalizar alguns screenshots de gráficos gerados pelo Highcharts:

Página anterior

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

Uma introdução à biblioteca GD

Criando um blog com o CakePHP 2.2.1

Gerando gráficos com PHP e highcharts.com

O uso de templates em PHP

Instalando a extensão json para o php-5.1 no CentOS/Red Hat

Comentários

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

Muito interessate. Pode ser usado com outras linguagens web ?

0 0

[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.

0 0

[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.

0 0

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

Parabéns pelo belo artigo!

0 0

[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.

0 0

[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!!!!

0 0

[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?

0 0

[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.

0 0

[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,

0 0