This is my first Power BI Visual that I made as a demo for a friend.
I used react for the majority of the build. I had to figure out how to make functional components work as the tutorial only shows you how to integrate react using class-based components.
The entry point to this code is src/visual.ts
. But most of the Component is in the src/App.tsx
file.
Its primary purpose was to be a table with clickable rows that would expand into a details view.
To set up, drag the columns you want in the table into the Summary
section and the columns you wish to have in the details view into the Details
section.
This will result in a table like so:
Need to setup pbiviz -> https://docs.microsoft.com/en-us/power-bi/developer/visuals/environment-setup?tabs=windows
then run
pbiviz start
Run:
pbiviz package
The custom viz will be in the dist
folder. You can then import the custom visual into power bi using that file
Currently, the "Overdue" red highlight is hardcoded to look for a field/column named DUE
A little more time needs to be invested in learning the Power BI custom visual API to learn how to incorporate custom options and custom settings like conditional highlighting.