Gerando gráficos com PHP + FusionCharts

Esse Post foi movido para :

http://clares.com.br/2008/08/10/gerando-graficos-com-php-fusioncharts/

Desculpe pelo transtorno, aproveite para assinar o novo blog.

Marcado:, , , ,

34 pensamentos sobre “Gerando gráficos com PHP + FusionCharts

  1. cleber setembro 17, 2008 às 2:34 pm

    adorei o post…
    mas sou iniciante estou começando agora …
    seria super legal se mandasse o pacote…

  2. Marco dezembro 4, 2008 às 4:12 pm

    Cara muito bacana o tutorial… ja to usando e gostei muito do resultado… só não achei uma forma de alinhar o grafico… pois ele sempre fica centralizado… e eu gostaria de deixar ele alinhado a esquerda… se puder dar uma força eu agradeço !!!

    abraço

    • Rafael Clares dezembro 5, 2008 às 2:50 am

      Olá Marco, faça o seguinte no arquivo fusioncharts.php que é reponsável por gerar o gráfico tem uma linha que cria uma div assim div id="$chartIdDiv" align="center"
      altere para div id="$chartIdDiv" align="left" este código está na linha 86 do arquivo includes/fusioncharts.php depois da linha $render_chart basta procurar ok. Obrigado pelo comentário

  3. Liz fevereiro 3, 2009 às 6:52 pm

    Olá Rafael,
    gostei muito dos gráficos da FusionCharts, mas estou com um pouco de dificuldade de usar com BD. Será que tu já fez o exemplo?! Poste aí!!!
    Parabéns pelo Blog!!! Valew

  4. Fabio maio 13, 2009 às 8:43 pm

    Muito útil cara, parabéns…

  5. Thiago outubro 22, 2009 às 6:34 pm

    Olá Rafael,

    parabéns pelo post.
    Achei muito didático, fiz os exemplos aqui e funcionou muito bem.
    Gostaria de saber se vc tem um tutorial PHP+FC utilizando banco de dados. Utilizo o postgres aqui e preciso buscar os dados da base. Se tiver algum exemplo e puder enviar pro meu e-mail fico muito grato.

    []’s

    • Rafael Clares outubro 22, 2009 às 7:37 pm

      Thiago, obrigado pelo comentário.
      O exemplo proposto é https://clares.wordpress.com/2008/09/01/gerando-graficos-com-php-postgresql/
      no entanto não tem uma explanação muito legal, há tempos que estou querendo atualizar este post mas o tempo não tem sobrado viu … baixe o pacote e se tiver dúvidas vá me perguntando. Mas cara, por favor não vá direto no download ok, dê uma lida nas referências e links para entender legal.

      Abraços,

  6. Idol outubro 7, 2010 às 1:46 am

    Oi, Rafael!

    Parabéns pelo post… Muito interesante!

    Só não estou conseguindo renderizar o gráfico no Browser. Estou utilizando o segundo exemplo, setando uma variável php para gerar o XML. Não dá erro na página… Ao invés disso aparece apenas a palavra “Chart.” Onde será que estou errado??

    Agradeço se puder me ajudar. :-)

    Abraços!

    • Rafael Clares outubro 7, 2010 às 1:57 am

      Faz o download e testa sem alterar: http://clareslab.com.br/learn/charts/charts.rar

      • Idol outubro 8, 2010 às 12:09 am

        Poxa, não funciona… :-(

        O código que me enviou funciona perfeitamente no root do htdocs, sem problemas. Mas qdo entro com ele no contexto da minha aplicação, nada é exibido na div. Apenas a palavra “Chart”.

        Na verdade, estou usando o framework CodeIgniter. Acesso o Controller pela url que é responsável por chamar a View onde o código com o FusionCharts se encontra. Curiosamente, criei uma view na minha aplicação para testar o código que me enviou. Funcionou mais cedo e fiquei todo feliz! Quando foi agora, parou de funcionar.

        Será que é algum problema do Framework??

        Obrigado pela ajuda, Rafael! E parabéns pelo excelente trabalho.

      • Rafael Clares outubro 8, 2010 às 1:17 am

        Idol, é isso sim, mas não é problema no framework, é que depende de onde estão os diretórios e como está configurado o Rewrite.
        por exemplo, o CodeIgniter tem a estrutura abaixo:
        index.php (arquivo)
        system (diretório)

        a partir do system, já eras você não tem mais url absoluta!
        Onde estão, na hierarquia do CI, seus diretórios css, images, jscripts ?
        Dentro de views, fora?

        Uma dica para o CodeIgniter (há uns 15 meses eu quebrei cabeça também).
        Minha estrutura era assim no CI:

        – /
        – index.php
        – system
        – css
        – images
        – jscripts

        Daí você consegue a url absoluta porque está fora da aplicação, mesmo assim você precisa criar a regra abaixo no .htaccess

        <IfModule mod_rewrite.c>
        RewriteEngine on
        RewriteCond $1 !(index\.php|images|css|jscripts|robots\.txt|cgi-local|cgi-bin|phpinfo\.php)
        RewriteRule ^(.*)$ index.php/$1 [L]
        </IfModule>

        Dá o rewrite será ignorado quando por ex exitir /css/ /images/ /jscripts/

        Suponha que na sua view queira colocar uma imagem e ficaria:
        <img src=”/images/foo.png”>

        Cara, não é difícil mas é chato, boa sorte, vai precisar um pouco.
        abs

  7. Idol outubro 8, 2010 às 1:31 am

    Olá, Rafael!

    Minha estrutura no CodeIgniter é:

    – nome-da-minha-aplicacao
    – system
    – css
    – img
    – js
    – index.php

    Por enquanto estou testando tudo local, pois estou com um problema no servidor lá da empresa. Mesmo assim é preciso do arquivo .htaccess p/ testar localmente?

    Outra dúvida é: Com base na minha estrutura de diretórios, onde devem ficar os arquivos do FusionCharts? Por exemplo, posso deixar o FusionCharts.js na minha pasta js(pasta do javaScrip). E devo mudar algo no meu código baseado nos exemplos que vc postou aqui no post por eu estar usando o codeIgniter?

    Muito obrigado pela ajuda e rapidez nas respostas! Te tiver algo que possa fazer por você tb, por favor me avise! Sei lá, algum livro que queira ganhar :-)

    Abraços!

    • Rafael Clares outubro 8, 2010 às 1:44 am

      – nome-da-minha-aplicacao
      – system
      – css
      – charts (dentro você deixa o diretório do fusion)
      – img
      – js
      – index.php

      exemplo do arquivo php:


      <script src="/charts/FusionCharts/FusionCharts.js"> </script >
      <?php
      print renderChart("/charts/FusionCharts/FCF_Column3D.swf", "Data/Data.xml", "", "myFirst", 600, 300, false, false);
      ?>

      Considerando que o diretório do fusion esteja dentro de /charts/ .

      abs

  8. claudio outubro 28, 2010 às 7:25 pm

    Olá muito boa a matéria. Eu baixei o fusion charts e criei o xml. Mas no meu modelo de negócio preciso do Funil de vendas. Pois bem meu xml alimenta ele, mas não está filtrando a partir do maior para o menor, será que vc poderia me ajudar?

    • Rafael Clares outubro 29, 2010 às 5:48 pm

      Cláudio estou sem internet até segunda, só a partir desse dia poderia ajudar ok.

    • Rafael Clares outubro 31, 2010 às 1:37 am

      Cláudio, a questão é que o fusioncharts não vai filtrar esse resultado, ele monta o gráfico de acordo com a ordem do XML, então você precisa ordenar sua aplicação para que o XML seja gerado na ordem desejada.
      Se estiver montando o XML manualmente basta colocar na ordem que deseja, se está montando a partir de uma consulta SQL você precisa colocar o order by na sua query, ex:
      $query = “SELECT * FROM EMPLOYEES ODER BY EMPLOYEE_ID DESC” ; // maior para menor
      até logo

  9. fabiano dezembro 6, 2010 às 5:41 pm

    rafael, tudo bom?

    estou precisando fazer colocar dados no Hover Caption Box do funsion charts. Você tem alguma dica?

    Abraços,

    • Rafael Clares dezembro 7, 2010 às 1:08 pm

      Olá Fabiano, infelizmente utilizei só o básico do FC como você vê aí, acredito que seja mais fácil você encontrar essa informação no site do fusion e até mesmo nos exemplos da versão free que pode ser baixada. Desculpe não poder ajuda-lo!

  10. vitor fevereiro 28, 2011 às 4:58 pm

    Ola!

    ótimo artigo!

    vc já trabalhou com o ZoomLine? (da fusionchart)… Não encontro um exemplo prático como o seu na web.

    Obrigado!

    • Rafael Clares março 1, 2011 às 3:42 pm

      Vitor, lamento brother mas eu nem vi ainda. Fico te devendo essa.
      Abs

  11. Andre Chagas maio 30, 2011 às 7:42 pm

    Cara, muito bom o seu exemplo bem pratico, vou ver se consigo fazer pegando as informações de um banco e montar o xml dentro de uma variavel, e gerar um grafico dinamico, queria saber se no campo values agente pode colocar mais de um valor pois o grafico que eu preciso é 2 valores para 1 item.

    Abraços e continue sempre com o seu trabalho ta muito bom.

  12. Júlio César junho 24, 2011 às 11:23 pm

    Pegando dados do banco

    $sql = “SELECT * FROM info”;
    $query = mysql_query($sql);
    $num = mysql_num_rows($query)+1;

    $cores = array(‘AFD8F8′,’F6BD0F’,’8BBA00′,’FF8E46′,’008E8E’,’D64646′,’8E468E’,’588526′,’B3AA00′,’008ED6′,’9D080D’,’A186BE’);

    $strXML = “”;
    while($row = mysql_fetch_array($query))
    {
    $r = array_rand($cores, ($num-1));
    $cor = $cores[$r[0]];
    $ret = array_search($cor, $cores);
    unset($cores[$ret]);
    $strXML .= “”;
    }
    $strXML .= “”;

  13. Rogério Paulo Flores setembro 9, 2011 às 11:16 am

    Ótimo post Rafael, bem didático me ajudou bastante.

    Vlw

  14. Dorival Junior março 20, 2012 às 1:56 pm

    Olá Rafael, muito boa dica! Funcionou tudo corretamente.
    Só tenho uma pergunta: no eixo y, existe como deixar apenas o valor sem acrescentar “.00” nos valores? Procurei no arquivo FusionCharts.php e nao encontrei onde poderia mudar…
    se puder dar uma força, agradeço,

    valeu!

  15. Marcia abril 30, 2012 às 9:15 pm

    oiii, perfeito
    parabens!!!
    existe uma maneira de gerar 2 graficos diferentes, mas aparecendo na mesma pagina? na verdade gero 2 de linhas, porem um com qtd e outro com valores, gera normalmente, porem sobreescreve os charts….
    eu precisava um em cima na pagina, e outro logo abaixo…

    • Rafael Clares maio 1, 2012 às 3:29 pm

      Sim, você viu a demonstração, certo? Então, na demo tem mais de 5 gráficos!
      Veja esse exemplo abaixo é o exemplo da demo:

      include(“includes/FusionCharts.php”);
      echo renderChart(“charts/FCF_Funnel.swf”, “”, $strXML, “g1”, 600, 300);
      echo renderChart(“charts/FCF_Line.swf”, “”, $strXML, “g3”, 600, 300);
      echo renderChart(“charts/FCF_Column3D.swf”, “”, $strXML, “g2”, 600, 300);
      echo renderChart(“charts/FCF_Area2D.swf”, “Data/Area2D.xml”, “”, “g4”, 600, 300);
      echo renderChart(“charts/FCF_Pie3D.swf”, “”, $strXML, “g5”, 600, 600);

      mandei no seu email ok

  16. Evandro maio 18, 2012 às 7:17 pm

    Estou com dificuldades na hora de Formatação número em FusionCharts, mesmo visualizando os link http://docs.fusioncharts.com/charts/contents/advanced/number-format/Number_Basics.html
    http://docs.fusioncharts.com/charts/contents/advanced/number-format/Number_Scaling.html
    http://docs.fusioncharts.com/charts/contents/advanced/number-format/Rec_Num_Scaling.html

    O meu codigo esta assim: <?php
    $bancos = $row_grafic_bancos['valor'];
    $despesas = $row_grafic_despesas['valor'];
    $folha = $row_grafic_folha['valor'];
    $fornecedor = $row_grafic_fornecedor['valor'];
    $impostos = $row_grafic_impostos['valor'];
    $pessoal = $row_grafic_pessoal['valor'];

    $strXML = "”;
    $strXML .= “”;
    $strXML .= “”;
    $strXML .= “”;
    $strXML .= “”;
    $strXML .= “”;
    $strXML .= “”;
    $strXML .= “”;
    include(“includes/FusionCharts.php”);
    echo renderChart(“charts/FCF_Column3D.swf”, “”, $strXML, “chart1”, 600, 300);
    ?>

    De qualquer maneira, tenho que agradecer meus olhos estão brilhando com os resultados desse tutorial.

    • Evandro maio 19, 2012 às 3:33 pm

      Opa Consegui:>
      <?php
      $bancos = $row_grafic_bancos['valor'];
      $despesas = $row_grafic_despesas['valor'];
      $folha = $row_grafic_folha['valor'];
      $fornecedor = $row_grafic_fornecedor['valor'];
      $impostos = $row_grafic_impostos['valor'];
      $pessoal = $row_grafic_pessoal['valor'];

      $strXML = "”;
      $strXML .= “”;
      $strXML .= “”;
      $strXML .= “”;
      $strXML .= “”;
      $strXML .= “”;
      $strXML .= “”;
      $strXML .= “”;
      include(“includes/FusionCharts.php”);
      echo renderChart(“charts/FCF_Column3D.swf”, “”, $strXML, “chart1”, 750, 300);
      ?>

      Valew otimo post

  17. Vagner Oliveira junho 28, 2012 às 1:31 am

    Man, existe algum meio de transforma essa medidas norte americana, em brasileira.

    • Rafael Clares junho 28, 2012 às 5:02 pm

      Vagner, o ideal é você dar uma lida nas docs do fusioncharts, tem como fazer sim mas você precisa ver na documentação, se ler os comentários irá perceber que outras pessoas também questionaram isso e eu passei o link da documentação, não é muito ruim de fazer, mas agora não tenho em mente como faz. Abs

Os comentários estão desativados.

%d blogueiros gostam disto: