Pokédex em Power BI: HTML, DAX e JavaScript
Um relatório público com 1.302 Pokémon, cartas do TCG e quatro páginas em JavaScript (arena de batalhas, tipos, quiz e safari), tudo gerado por medidas DAX no visual HTML Content.
- Contexto
- Projeto pessoal, publicado na web
- Meu papel
- Modelagem, DAX, Power Query e front-end dentro do Power BI
- Período
- 2026
- Ferramentas
- Power BI, DAX, Power Query (M), HTML Content, JavaScript, PBIP (TMDL e PBIR), Python
Como a solução funciona
- Fontes PokeAPI (GraphQL) e Pokémon TCG Data
- Power Query 11 consultas tratam formas, evoluções e fraquezas
- DAX 35 medidas devolvem HTML, CSS e dados para o JavaScript
- HTML Content Pokédex, Arena, Tipos, Quiz e Safari
Por que um relatório de Pokémon num portfólio de BI
É um jeito divertido de mostrar, num arquivo aberto a qualquer pessoa, as mesmas técnicas que uso em painéis financeiros: HTML e CSS gerados por DAX, interações com tabelas desconectadas, uma fonte de dados bem tratada no Power Query e o relatório inteiro versionado como código.
O que ele faz
- Pokédex com 1.302 Pokémon (formas incluídas), radar de atributos em SVG, fraquezas de 4× até imunidade e fundo animado por tipo.
- Modos Normal, Shiny e Cartas, com 17,5 mil cartas do Pokémon TCG casadas com a forma exibida.
- Evolução e formas clicáveis, com animação de evolução.
- Arena de batalhas 1x1 ou com times de 3: fórmula oficial de dano, IA que escolhe golpes e troca de Pokémon, Mega Evolução, Gigantamax e simulação de mil batalhas.
- Roda e matriz de tipos, ranking das 171 combinações defensivas, quiz "Quem é esse Pokémon?" e um minijogo Safari em pixel art.
Como foi feito
- Uma consulta GraphQL na PokeAPI traz todos os dados de uma vez; onze consultas em M derivam o restante.
- Medidas DAX que devolvem HTML e CSS separados, renderizados pelo visual HTML Content.
- Tabelas desconectadas guardam os cliques de evolução, forma e modo sem filtrar a lista.
- JavaScript dentro de medidas:
[JS Dados]transforma o modelo num objeto JavaScript e cada página de jogo roda a partir dele. - PBIP no Git: modelo em TMDL, relatório em PBIR e dois scripts em Python que gravam tudo a partir dos arquivos-fonte.
Os detalhes, com imagens e animações de cada página, estão no post do blog.