Criando gráficos via AdvPL com FWChartBar

Criando gráficos via AdvPL com FWChartBar

Olá pessoal…

Hoje vou mostrar um exemplo simples de como criar gráfico de barra em AdvPL, utilizando a classe FWChartBar.


Exemplo de FWCharBar
Exemplo de FWCharBar

Foram criadas novas classes para geração de gráficos substituindo a antiga TMSGraphic, abaixo uma lista das classes novas com o link para o TDN (todas herdam da FwChartFactory):
FWChartBar – Gráficos de Barra
FWChartBarComp – Gráficos de Barra (Comparação)
FWChartLine – Gráficos de Linha
FWChartPie – Gráficos de Pizza

E abaixo um exemplo simples de FWChartBar (do print acima):

//Bibliotecas
#Include "Protheus.ch"  

/*/{Protheus.doc} zTstChart
Função de teste da classe FWChartBar
@type function
@author Atilio
@since 01/12/2015
@version 1.0
	@example
	u_zTstChart()
	@see http://tdn.totvs.com/display/public/mp/FWChartBar
/*/

User Function zTstChart()
	Local oChart
	Local oDlg
	Local aRand := {}
	
	//Cria a Janela
	DEFINE MSDIALOG oDlg PIXEL FROM 0,0 TO 400,600
		//Instância a classe
		oChart := FWChartBar():New()
		
		//Inicializa pertencendo a janela
		oChart:Init(oDlg, .T., .T. )
		
		//Seta o título do gráfico
		oChart:SetTitle("Título", CONTROL_ALIGN_CENTER)
		
		//Adiciona as séries, com as descrições e valores
		oChart:addSerie("Ano 2011", 20044453.50)
		oChart:addSerie("Ano 2012", 21044453.35)
		oChart:addSerie("Ano 2013", 22044453.15)
		oChart:addSerie("Ano 2014", 23044453.10)
		oChart:addSerie("Ano 2015", 25544453.01)
		
		//Define que a legenda será mostrada na esquerda
		oChart:setLegend( CONTROL_ALIGN_LEFT )
		
		//Seta a máscara mostrada na régua
		oChart:cPicture := "@E 999,999,999,999,999.99"
		
		//Define as cores que serão utilizadas no gráfico
		aAdd(aRand, {"084,120,164", "007,013,017"})
		aAdd(aRand, {"171,225,108", "017,019,010"})
		aAdd(aRand, {"207,136,077", "020,020,006"})
		aAdd(aRand, {"166,085,082", "017,007,007"})
		aAdd(aRand, {"130,130,130", "008,008,008"})
		
		//Seta as cores utilizadas
		oChart:oFWChartColor:aRandom := aRand
		oChart:oFWChartColor:SetColor("Random")
		
		//Constrói o gráfico
		oChart:Build()
	ACTIVATE MSDIALOG oDlg CENTERED
Return

Esses e outros códigos, estão disponíveis gratuitamente no nosso GitHub, acesse em github.com/dan-atilio/AdvPL.

Atualização em 18/02/2017:
Consegui achar uma referência com algumas possíveis cores para utilização:

aAdd(aRand, {"199,199,070", "022,022,008"}) //Amarelo Escuro
aAdd(aRand, {"084,120,164", "007,013,017"}) //Azul Claro
aAdd(aRand, {"054,090,134", "007,013,017"}) //Azul Escuro
aAdd(aRand, {"175,175,175", "011,011,011"}) //Cinza Claro
aAdd(aRand, {"130,130,130", "008,008,008"}) //Cinza Médio
aAdd(aRand, {"100,100,100", "008,008,008"}) //Cinza Escuro
aAdd(aRand, {"207,136,077", "020,020,006"}) //Laranja Claro
aAdd(aRand, {"177,106,047", "020,020,006"}) //Laranja Escuro
aAdd(aRand, {"001,001,001", "001,001,001"}) //Preto
aAdd(aRand, {"141,225,078", "017,019,010"}) //Verde Claro
aAdd(aRand, {"171,225,108", "017,019,010"}) //Verde Escuro
aAdd(aRand, {"166,085,082", "017,007,007"}) //Vermelho Claro
aAdd(aRand, {"136,055,052", "017,007,007"}) //Vermelho Escuro

Atualização em 20/09/2017:
Conforme muitos pediam, montei um exemplo de como gerar o gráfico e já inserir ele em um relatório. Para fazer isso, é só ao iniciar a tela do relatório, gerar um png, e fechar a tela em seguida. Depois com essa imagem você consegue imprimir em um TMSPrinter ou FWMSPrinter.
Abaixo um print do resultado:

Exemplo de relatório FWMSPrinter com gráfico
Exemplo de relatório FWMSPrinter com gráfico

E abaixo o código fonte completo desenvolvido:

//Bibliotecas
#Include "Protheus.ch"
#Include "TopConn.ch"
#Include "RPTDef.ch"
#Include "FWPrintSetup.ch"

#Define PAD_LEFT	0
#Define PAD_RIGHT   1
#Define PAD_CENTER  2

/*/{Protheus.doc} zTeste
Função de teste para gerar o gráfico em um relatório
@author Atilio
@since 20/09/2017
@version undefined

@type function
/*/

User Function zTeste()
	Local aArea       := GetArea()
	Local cNomeRel    := "rel_teste_"+dToS(Date())+StrTran(Time(), ':', '-')
	Local cDiretorio  := GetTempPath()
	Local nLinCab     := 025
	Local nAltur      := 250
	Local nLargur     := 1050
	Local aRand       := {}
	Private cHoraEx    := Time()
	Private nPagAtu    := 1
	Private oPrintPvt
	//Fontes
	Private cNomeFont  := "Arial"
	Private oFontRod   := TFont():New(cNomeFont, , -06, , .F.)
	Private oFontTit   := TFont():New(cNomeFont, , -20, , .T.)
	Private oFontSubN  := TFont():New(cNomeFont, , -17, , .T.)
	//Linhas e colunas
	Private nLinAtu     := 0
	Private nLinFin     := 820
	Private nColIni     := 010
	Private nColFin     := 550
	Private nColMeio    := (nColFin-nColIni)/2
	
	//Criando o objeto de impressão
	oPrintPvt := FWMSPrinter():New(cNomeRel, IMP_PDF, .F., /*cStartPath*/, .T., , @oPrintPvt, , , , , .T.)
	oPrintPvt:cPathPDF := GetTempPath()
	oPrintPvt:SetResolution(72)
	oPrintPvt:SetPortrait()
	oPrintPvt:SetPaperSize(DMPAPER_A4)
	oPrintPvt:SetMargin(60, 60, 60, 60)
	oPrintPvt:StartPage()
	
	//Cabeçalho
	oPrintPvt:SayAlign(nLinCab, nColMeio-150, "Relatório Teste de Gráfico", oFontTit, 300, 20, RGB(0,0,255), PAD_CENTER, 0)
	nLinCab += 35
	nLinAtu := nLinCab
	
	//Se o arquivo existir, exclui ele
	If File(cDiretorio+"_grafico.png")
		FErase(cDiretorio+"_grafico.png")
	EndIf
	
	//Cria a Janela
	DEFINE MSDIALOG oDlgChar PIXEL FROM 0,0 TO nAltur,nLargur
		//Instância a classe
		oChart := FWChartBar():New()
		 
		//Inicializa pertencendo a janela
		oChart:Init(oDlgChar, .T., .T. )
		 
		//Seta o título do gráfico
		oChart:SetTitle("Título", CONTROL_ALIGN_CENTER)
		 
		//Adiciona as séries, com as descrições e valores
		oChart:addSerie("Ano 2011", 20044453.50)
		oChart:addSerie("Ano 2012", 21044453.35)
		oChart:addSerie("Ano 2013", 22044453.15)
		oChart:addSerie("Ano 2014", 23044453.10)
		oChart:addSerie("Ano 2015", 25544453.01)
		 
		//Define que a legenda será mostrada na esquerda
		oChart:setLegend( CONTROL_ALIGN_LEFT )
		 
		//Seta a máscara mostrada na régua
		oChart:cPicture := "@E 999,999,999,999,999.99"
		 
		//Define as cores que serão utilizadas no gráfico
		aAdd(aRand, {"084,120,164", "007,013,017"})
		aAdd(aRand, {"171,225,108", "017,019,010"})
		aAdd(aRand, {"207,136,077", "020,020,006"})
		aAdd(aRand, {"166,085,082", "017,007,007"})
		aAdd(aRand, {"130,130,130", "008,008,008"})
		 
		//Seta as cores utilizadas
		oChart:oFWChartColor:aRandom := aRand
		oChart:oFWChartColor:SetColor("Random")
		 
		//Constrói o gráfico
		oChart:Build()
	ACTIVATE MSDIALOG oDlgChar CENTERED ON INIT (oChart:SaveToPng(0, 0, nLargur, nAltur, cDiretorio+"_grafico.png"), oDlgChar:End())
	
	oPrintPvt:SayBitmap(nLinAtu, nColIni, cDiretorio+"_grafico.png", nLargur/2, nAltur/1.6)
	nLinAtu += nAltur/1.6 + 3
	
	oPrintPvt:SayAlign(nLinAtu, nColIni+020, "Teste FWMSPrinter",                            oFontSubN, 100, 07, , PAD_LEFT, )
	
	//Impressão do Rodapé
	fImpRod()
	
	//Gera o pdf para visualização
	oPrintPvt:Preview()
	
	RestArea(aArea)
Return

/*---------------------------------------------------------------------*
 | Func:  fImpRod                                                      |
 | Desc:  Função para impressão do rodapé                              |
 *---------------------------------------------------------------------*/

Static Function fImpRod()
	Local nLinRod := nLinFin + 10
	Local cTexto  := ""

	//Linha Separatória
	oPrintPvt:Line(nLinRod, nColIni, nLinRod, nColFin, RGB(200, 200, 200))
	nLinRod += 3
	
	//Dados da Esquerda
	cTexto := "Relatório Teste    |    "+dToC(dDataBase)+"     "+cHoraEx+"     "+FunName()+"     "+cUserName
	oPrintPvt:SayAlign(nLinRod, nColIni,    cTexto, oFontRod, 250, 07, , PAD_LEFT, )
	
	//Direita
	cTexto := "Página "+cValToChar(nPagAtu)
	oPrintPvt:SayAlign(nLinRod, nColFin-40, cTexto, oFontRod, 040, 07, , PAD_RIGHT, )
	
	//Finalizando a página e somando mais um
	oPrintPvt:EndPage()
	nPagAtu++
Return

Bom pessoal, por hoje é só.
Abraços e até a próxima.

About Dan_Atilio

Analista e desenvolvedor de sistemas. Técnico em Informática pelo CTI da Unesp. Graduado em Banco de Dados pela Fatec Bauru. Entusiasta de soluções Open Source e blogueiro nas horas vagas. Autor do projeto Terminal de Informação, onde são postados tutoriais e notícias envolvendo o mundo da tecnologia.

14 comentários em “Criando gráficos via AdvPL com FWChartBar

  1. No meu caso funcionou tudo, menos a questão de cores. Ele não está deixando escolher as cores que quero, independente se coloco random ou se seto uma cor fixa. Ele só fica cor padrão.

      1. Inclusive to fazendo o gráfico do tipo pizza e também não consigo alterar as cores… Liguei no suporte da Totvs e eles me falaram que não tem como alterar as cores… Que vai pegar sempre as cores padrões…

        1. Boa noite Mario, tudo bem?
          Então, cacei aqui nas minhas referências, e ele realmente deixa a cor padrão (azulada), mas é possível definir algumas cores (poucas), no caso desse exemplo mesmo eu uso laranja, vermelho, cinza, etc).
          Infelizmente não achei nenhuma documentação sobre as cores aceitas.

    1. Fala Thiago, tudo bem?
      É possível sim, geralmente é o que eu faço, onde meu Painel (oPanelTst), vai pertencer a minha Dialog (oDialogTst) e o gráfico estará no Painel (oChartTst), por exemplo:

      oPanelTst := tPanel():New(nLinha, nColuna, "", oDialog, , , , RGB(000,000,000), RGB(254,254,254), nLargGraf, nAltuGraf)
      oChartTst := FWChartBar():New()
      oChartTst:Init(oPanelTst, .T., .T.)
      

      Espero ter ajudado.
      Um grande abraço.

  2. Eu não to conseguindo fazer mostrar os valores das séries, existe alguma forma de mostrar o valor? Aqui só mostra se eu posicionar o cursor, queria que aparecesse junto a série.

    1. Boa noite João, tudo bem?
      Eu também não consegui achar uma forma, então como paliativo, eu coloco como título da série, por exemplo:

      nValor := 5000
      oChartTst:addSerie("Série X "+Alltrim(Transform(nValor, "@E 99,999.99")), nValor)
      

      Espero ter ajudado.
      Abraços.

    1. Boa noite Murilo, tudo bem?
      Rapaz, não sei te dizer, eu nunca precisei mudar a escala.
      E quando eu fiz, lembro de ter dividido os valores para ficar menor o gráfico.
      Acho que cabe um chamado nessa questão.
      Um grande abraço.

    1. Boa noite Jose, tudo bem?
      Você teria que ao abrir a tela com o gráfico, gerar um png dele, e esse png você imprime em um TMSPrinter ou FWMSPrinter.
      Eu atualizei a postagem com um exemplo completo, espero que ajude.
      Abraços.

Deixe uma resposta

%d blogueiros gostam disto: