graficos com primefaces
DESCRIPTION
Tutorial ensinando como trabalhar com gráficos utilizando a API PrimeFaces para JSFTRANSCRIPT
GráficosCom
Por Bruno Paulino
Motivação
Aprender a criar e manipular gráficos utilizando a tecnologia JAVA WEB.
Mas, como?
Problema: Como criar gráficos com um sistema desenvolvido em JAVA e JSF?Solução: Utilizando a API PrimeFaces para fazer esse duro trabalho por nós.
Montando o cenárioUtilizaremos um cenário hipotético expressando o total de vendas(em milhões) por ano dos países abaixo:
Brasil;Estados Unidos;Alemanha.
Dados hipotéticos
2011 1002012 1202013 502011 1602012 1302013 782011 302012 802013 23
País Ano Total de Vendas
Mão na massa
1. Crie um projeto Java Web no Eclipse e adicione as dependências JSF;
2. acesse www.primefaces.org e faça o download do .jar mais atual (por enquanto é a versão 3.5);
3. inclua no seu projeto Eclipse o .jar do primefaces.
Mão na massaEstrutura final do projeto Eclipse
Mão na massa
1. Classe País:• String nome;• Map<String, Integer> vendas;
Armazena o nome do País e os anos e o volume de vendas do respectivo ano.
Gráficos em Colunas Classe GraficoColunaBean :• Utiliza o objeto do tipo CartesianChartModel (Classe própria do PrimeFaces);
• Utiliza o objeto do tipo ChartSeries(Classe própria do Primefaces);
CartesianChartModel:
•Classe resposável por manipular os objetos ChartSeries e gerar o gráfico para a view.
ChartSeries:
•Classe resposável por armazenar os dados de cada país(nome, ano e total de vendas) e compor o objeto CartesianChartModel.
Nosso arquivo GraficoColunaBean.java - PARTE 1
Objetos ChartSeries que comporão o objeto CartesianChartModel
Nosso arquivo GraficoColunaBean.java - PARTE 2
Classe resposável por gerar os gráficos na visão.
Adicionamos os objetos ChartSeries ao objeto Colunas
VisãoGráficos em Colunas
Nosso arquivo primecolunas.xhtml
Propriedade do tipo CartesianChartModel do Bean
colunaBean.
tag barChart do PrimeFaces que recebe um objeto CartesianChartModel e monta
o gráfico na View.
Enfim... Gráficos! Label dos objetos ChartSeries
Valor minimo e máximo definidos na view usando
a tag barChart do PrimeFaces
Ano das vendas
Gráfico Pizza
Agora Veremos como funciona a classe PieChartModel, reponsável por gerar o gráfico no formato Pizza.
Nosso arquivo GraficoPizzaBean.java
Classe responsável por gerar o gráfico Pizza na view.
Adicionamos o nome e o total de vendas de cada país no ano de 2011
ao objeto PieChartModel.
Nosso arquivo PrimePizza.xhtml
Aqui acessamos a propriedade pizza do tipo PieChartModel do Bean
pizzaBean
tag pieChart do PrimeFaces que recebe um objeto PieChartModel e monta o
gráfico na View.
Novamente... Gráficos!
Código Fonte:https://github.com/brunojppb/GraficosComPrimeFaces
if(DUVIDAS){ “Podem perguntar”;}else{ “Obrigado!”;}