Power BI e Visuais Interativos em R

Criando visuais HTML, totalmente iterativos, utilizando as bibliotecas visNetowrk e Plotly.

Higor Gomes
Creditas Tech
6 min readJun 7, 2021

--

Capa do artigo. Fonte: o autor.

Introdução

O Power BI é um conjunto de ferramentas de business analytics para analisar dados e compartilhar ideias [1], possibilitando a construção de self-service dashboards em escala coorporativa com alto nível de proteção, somados à grande variedade de possibilidades de visualizações e integrações de dados disponíveis.

Além das visualizações nativas da ferramenta, temos as visualizações disponíveis no marketplace, desenvolvidas pela comunidade, podendo ser utilizadas como forma de expandir as possibilidades de construção do seu painel interativo. Mas a ferramenta não para por aí: além das duas opções anteriores, é possível criar os seus próprios visuais customizados com um pouquinho de programação e criatividade. Esse artigo traz uma das maneiras de realizar essa façanha, criando uma visualização do tipo grafo direcional e outra do tipo dispersão tridimensional, ambas interagindo com os filtros e dados inseridos diretamente na aplicação desktop.

Base de Dados

Primeiramente, será feita a preparação da base de dados. Como exemplo, usaremos os dados disponíveis na plataforma Kaggle referentes ao universo Star Wars. São os mesmos dados utilizados nesse artigo aqui, em que geramos um grafo no Google Sheets. Para esse caso, o formato esperado está apresentado na Figura 1 abaixo.

Figura 1: base de dados para a construção do grafo. Fonte: o autor.

Teremos os seguintes atributos:

  • source: nó de partida;
  • source_weight: peso (tamanho) do nó de partida;
  • source_area: a qual área o nó de partida pertence;
  • source_color: qual será a cor que utilizaremos para esse nó de partida (de acordo com sua área);
  • target: nó de chegada;
  • target_weight: peso (tamanho) do nó de chegada;
  • target_area: a qual área o nó de chegada pertence;
  • target_color: qual será a cor que utilizaremos para esse nó de chegada (de acordo com sua área);
  • edge_weight: peso (intensidade) da interação entre o nó de partida e o nó de chegada.

Vale destacar que os atributos source_area e target_area não fazem parte da base original, e foram criados a título de enriquecimento da análise.

Além disso, teremos uma segunda base, de acordo com a Figura 2. Ela será utilizada na criação do visual de dispersão tridimensional, onde analisaremos 3 parâmetros das personagens: potencial, performance (olha a 9 Box aí!) e engajamento.

Figura 2: base de dados para a construção da dispersão. Fonte: o autor.

Teremos os seguintes atributos:

  • name: nome da personagem;
  • performance: valor da performance, entre 0 e 1;
  • potential: valor do potencial, entre 0 e 1;
  • engagement: valor do engajamento, entre 0 e 1;
  • area: área de qual a personagem faz parte.

Instalação do pbiviz

Para a criação dos visuais customizados, utilizaremos o pacote pbiviz. Para isso, é necessário ter instalado previamente o node.js em seu computador. Basta seguir o link e instalar a última versão estável para o seu sistema operacional. Feito isso, iremos abrir o terminal e digitar a seguinte linha de código:

npm install -g powerbi-visuals-tools

Para checar se a instalação ocorreu corretamente, chamamos o pacote:

pbiviz

Você deverá ver a tela representada na Figura 3 abaixo.

Figura 3: instalação do pbiviz. Fonte: Microsoft.

Feito isso, a criação do visual pode ser iniciada. Em tempo, garanta que você tenha o R e o R Studio instalados em seu computador, também. Utilizaremos essas tecnologias para o desenvolvimento. Basta seguir os links indicados para realizar a instalação.

Criação do Visual

Tendo todos os passos anteriores concluídos, é hora de criar o nosso primeiro visual customizado no Power BI. Para isso, basta digitar a seguinte linha de código no terminal:

pbiviz new grafo -t rhtml

Você deverá receber como resultado duas saídas, indicadas nas Figuras 4 e 5. A primeira delas é a resposta obtida no terminal; a segunda, é uma pasta criada com os documentos do nosso novo visual.

Figura 4: criação do visual. Fonte: o autor.
Figura 5: pasta criada automaticamente. Fonte: o autor.

O próximo passo consiste em editar dois documentos dessa pasta: os arquivos pbiviz (JSON) e script (R). O primeiro deles contém algumas informações que serão necessárias para a compilação do pacote e, consequentemente, para sua utilização no Power BI. As Figuras 6 e 7 mostram o antes e o depois desse documento, apontando as informações que precisam ser preenchidas. São elas: description, supportUrl, name, email. É possível alterar algumas outras, a título de customização apenas.

Figura 6: arquivo pbiviz incompleto. Fonte: o autor.
Figura 7: arquivo pbiviz editado. Fonte: o autor.

O próximo arquivo a ser editado é o script que, conforme o nome sugere, irá conter o código em R responsável pela criação do nosso visual customizado. O arquivo original terá um formato similar ao da Figura 8 apresentada abaixo.

Figura 8: arquivo script inicial. Fonte: o autor.

De acordo com a Figura 8, existem 3 partes no código que precisamos editar:

  • Library Declarations: informação de quais bibliotecas serão utilizadas para a construção do visual;
  • Actual Code: o código, propriamente dito. Os valores inseridos no Power BI serão tratados como a variável Values, que poderá ser encarada como um objeto do tipo dataframe.
  • Create and save widget: exportação do visual como html.

Os códigos utilizados, tanto para a construção do visual do tipo grafo, quanto da dispersão tridimensional, estão disponíveis aqui. A Figura 9 traz um exemplo de como ficará a cara do arquivo script.

Figura 9: arquivo script completo. Fonte: o autor.

Carregando o Visual

Com o visual editado, é hora de utilizá-lo no Power BI. Para isso, digitaremos a seguinte linha de código no terminal:

pbiviz package

Se tudo ocorreu bem até aqui, você deverá ver algo conforme representado na Figura 10.

Figura 10: criação do visual customiza. Fonte: o autor.

Feito isso, uma nova pasta irá aparecer dentro da pasta criada inicialmente: a pasta dist. Dentro dela teremos o nosso visual customizado, pronto para uso. A Figura 11 traz a nova cara da pasta de arquivos, enquanto a Figura 12 mostra o conteúdo da pasta dist.

Figura 11: adição automática da pasta dist. Fonte: o autor.
Figura 12: conteúdo da pasta dist. Fonte: o autor.

Por hora, terminamos a parte de códigos. Agora podemos carregar o nosso visual dentro do Power BI. Para isso, seguimos o seguinte caminho: Inserir → Mais visuais → Dos meus arquivos (também funciona se você clicar nos 3 pontinhos do painel de visualizações e selecionar Importar um visual de um arquivo). Feito isso, basta escolher o arquivo .pbiviz dentro pasta dist criada anteriormente.

Com o visual importado, você irá selecionar os dados que serão utilizados em sua composição. Vale lembrar que os dados estão conversando com o script por meio da variável Values, do tipo dataframe, e é importante incluir no modelo os atributos declarados no script.

O GIF abaixo mostra o resultado final obtido.

Resultado final obtido. Fonte: o autor.

Por fim, construímos o nosso painel. A partir dele, é possível observar 3 indicadores chaves de cada personagem, além de situá-los em suas redes de conexão na organização. As possibilidades são muitas, podendo customizar os gráficos (e suas dicas de ferramentas) de diversas formas, inclusive, colocando os valores de performance, engajamento e potencial no próprio grafo (aguardem os próximos artigos).

Conclusão

Existem algumas maneiras de se criar visuais customizados em Power BI. A própria documentação da ferramenta [2] traz uma possibilidade, utilizando a biblioteca D3.js. A apresentada nesse artigo é uma delas, e mostra que, com poucas linhas de código, um certo nível de paciência para os eventuais bugs (sempre acontece, né?) e criatividade, é possível obter resultados incríveis, aumento ainda mais o poder dessa ferramenta.

Referências

[1] https://powerbi.microsoft.com/en-us/blog/

[2] https://docs.microsoft.com/pt-br/power-bi/developer/visuals/environment-setup?tabs=windows

--

--