Documentação

Como usar o UI Power Pack no Power BI

O UI Power Pack foi criado para ajudar analistas, desenvolvedores e entusiastas de dados a transformarem dashboards em experiências visuais marcantes. Aqui você aprende a implementar Gráficos JSON diretamente no Power BI de forma simples, leve e eficiente.

Colaborar

📁 Baixe o exemplo completo

Experimente o UI Power Pack na prática! Baixe o arquivo .PBIX de exemplo (compactado em .ZIP) e explore o exemplo de Gráfico JSON aplicado dentro do Power BI.

Baixar arquivo .ZIP

💡 O arquivo inclui um modelo com componentes prontos, exemplos de medidas e estrutura básica de visual JSON.

Passo 1 — Prepare seu Power BI

Abra o Power BI Desktop e realize normalmente a carga da sua fonte de dados. Esse será o ambient e onde aplicaremos os componentes HTML.

Power BI Desktop interface

Interface do Power BI Desktop, onde os visuais HTML serão implementados.

Passo 2 — Adicione o visual Deneb

  1. No painel de Visualizações, clique nos três pontos (...) para abrir a opção “Obter mais visuais”.
  2. Pesquise por “Deneb”.
  3. Clique em “Adicionar” para instalar o visual.
    4. Power BI Desktop interface

    Interface para adicionar um novo visual.

Passo 3 — Insira o componente

  1. Com o visual Deneb adicionado, selecione-o para abrir o espaço de edição.
    2. Power BI Desktop interface
  2. No site do UI Power Pack, baixe o componente JSON desejado.
    3. Power BI Desktop interface

    Acessando a biblioteca de visuais para escolher um e baixar o arquivo JSON.

  3. No Power BI, selecione as colunas que precisa apresentar no gráfico.

    4. E clique em Editar.

    Power BI Desktop interface

Passo 4 — Inserir compoente JSON

  1. Após clicar em Editar, aparecerá a seguinte tela:
    2. Power BI Desktop interface

    Tela para inserir visual JSON.

  2. Clique no campo Import your file e selecione o arquivo JSON que você quer e importe o componente JSON que quer.
  3. Após importar, você so precisa selecionar os campos:
    4. Power BI Desktop interface

    Selecionar campos para o Gráfico JSON.

Passo 5 — Visualização

  1. Com todos os passos feitos e já vendo um Preview do gráfico, so precisa clicar em Voltar ao relátorio.
    2. Power BI Desktop interface
  2. Agora é so dimensionar em seu Dashboard e deixar ele 100x mais IMPRESSIONANTE!
    3. Power BI Desktop interface
⚠️ Atenção — pontos importantes
  • ✅ O Gráfico já vem com um Tooltip básico como todos os visuais padrões, mas também permite a criação de um personalizado como qualquer outro.
  • ✅ Tambem tem a funcionalidade básica, que ao clicar ele filtra os demais visuais/gráficos e também evidencia a coluna ou barra selecionada.