Este documento descreve como criar gráficos usando a API PrimeFaces no Java. Ele explica como configurar um projeto Java com as dependências necessárias, criar classes para armazenar dados de vendas por país e ano, e usar objetos da PrimeFaces para gerar gráficos de colunas e pizza na interface visualizando esses dados.

1. Gráficos
Com
PorBrunoPaulino

2. Motivação
Aprender a criar e manipular gráficos
utilizando a tecnologia JAVA WEB.

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

4. Montando o cenário
Utilizaremos um cenário hipotético
expressando o total de vendas(em milhões)
por ano dos países abaixo:
Brasil;
Estados Unidos;
Alemanha.

5. Dados hipotéticos
2011 100
2012 120
2013 50
2011 160
2012 130
2013 78
2011 30
2012 80
2013 23
País Ano Total de Vendas

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

7. Mão na massa
Estrutura final do projeto Eclipse

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

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

10. Nosso arquivo GraficoColunaBean.java - PARTE 1
Objetos ChartSeries que comporão o objeto
CartesianChartModel

11. Nosso arquivo GraficoColunaBean.java - PARTE 2
Classe resposável por gerar
os gráficos na visão.
Adicionamos os
objetos ChartSeries
ao objeto Colunas

12. Visão
Grá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.

13. Enfim... Gráficos! Label dos objetos ChartSeries
Valor minimo e máximo
definidos na view usando
a tag barChart do
PrimeFaces
Ano das vendas

14. Gráfico Pizza
Agora Veremos como funciona a classe
PieChartModel, reponsável por gerar o
gráfico no formato Pizza.

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

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

17. Novamente... Gráficos!
Código Fonte:
https://github.com/brunojppb/GraficosComPrimeFaces

18. if(DUVIDAS){
“Podem perguntar”;
}
else{
“Obrigado!”;
}