Custom Visuals
Beyond Power BI's built-in visual gallery, custom visuals extend reporting capability through AppSource-certified visuals, organization visuals imported from a file, or visuals built with the Power BI visuals SDK (pbiviz) using TypeScript and D3.js.
Cricket analogy: Extending Power BI beyond the built-in gallery is like a franchise bringing in a specialist spin-bowling coach beyond the core coaching staff - the base team covers most needs, but specific gaps need dedicated expertise.
Sourcing and Vetting Custom Visuals
AppSource visuals go through a Microsoft certification process (or are simply "Power BI validated") that checks for external network calls and malicious code, and only certified visuals are approved for use in organizations with strict data-loss-prevention policies, since uncertified visuals can phone home to external endpoints.
Cricket analogy: A certified AppSource visual is like a BCCI-approved bat brand tested for compliance before it's allowed in a match, whereas an unvetted custom visual is like walking onto the pitch with untested equipment that officials haven't cleared.
Popular examples include the Chiclet Slicer for tile-based filtering, Zebra BI or ValQ for advanced financial waterfall/variance analysis, and the Word Cloud visual, each of which is imported per-report via "Get more visuals" or a downloaded .pbiviz file added through "Import a visual from a file."
Cricket analogy: The Chiclet Slicer's tile-based team logos work like a scorecard app letting you tap a team crest to filter, while a Word Cloud built from post-match interview transcripts visually surfaces the most repeated phrases, like "process" or "character."
Building a Custom Visual with the SDK
Developers scaffold a new visual using the pbiviz CLI (npm install -g powerbi-visuals-tools, then pbiviz new), which generates a capabilities.json describing data roles and formatting objects plus a visual.ts implementing the update() method that Power BI calls whenever data or size changes.
Cricket analogy: Running "pbiviz new" scaffolds a fresh project the way a franchise sets up a new academy from a template - infrastructure exists immediately, but the actual coaching philosophy (the visual's logic) still has to be written into visual.ts.
Custom visuals should implement the IVisual interface's update lifecycle efficiently, since update() fires on every filter, resize, and cross-highlight, and heavy DOM rebuilding on each call causes visible lag; well-built visuals diff the incoming DataView and only redraw what changed.
Cricket analogy: A poorly built custom visual re-rendering its entire DOM on every filter click lags like a scoreboard operator manually rewriting the whole board after every single run instead of just updating the digit that changed.
Organization visuals (uploaded via the Power BI admin portal) differ from AppSource visuals: they're private to the tenant, don't require Microsoft certification, and are the standard path for internally built or licensed-but-uncertified visuals within a company's governance policy.
Unvetted third-party visuals can make external network calls that exfiltrate report data outside the tenant boundary; organizations with strict data-loss-prevention requirements should restrict report authors to certified AppSource visuals only, via the tenant admin portal's visual settings.
npm install -g powerbi-visuals-tools
pbiviz new my-custom-visual
cd my-custom-visual
pbiviz start- Custom visuals come from three sources: AppSource, organization visuals, or the pbiviz SDK.
- Microsoft-certified AppSource visuals are checked for malicious code and external network calls.
- Organization visuals bypass certification but stay private to the tenant, useful under governance policy.
- Popular certified examples include the Chiclet Slicer, Zebra BI/ValQ, and Word Cloud.
- The pbiviz CLI scaffolds a project with capabilities.json (data roles/formatting) and visual.ts (rendering logic).
- The update() method fires on every filter, resize, and cross-highlight-inefficient implementations cause visible lag.
- Tenant admins can restrict report authors to certified visuals only to satisfy data-loss-prevention requirements.
Practice what you learned
1. What does Microsoft's AppSource certification process check for in a custom visual?
2. Which command scaffolds a new custom visual project using the Power BI visuals SDK?
3. What method does Power BI call on a custom visual whenever data, filters, or size change?
4. How do organization visuals differ from AppSource visuals?
Was this page helpful?
You May Also Like
Choosing the Right Visual
How to match Power BI visual types to the shape of your data and the question you're actually answering, and the common chart-selection mistakes to avoid.
Report Formatting and Themes
How to use theme JSON, conditional formatting, bookmarks, and custom number formats to keep a Power BI report visually consistent and on-brand.
Slicers and Filters
How Power BI's three filtering layers-slicers, visual filters, and page/report filters-combine, sync, and interact with DAX filter-context functions.
Related Reading
Related Study Notes in Programming
Browse all study notesApache Spark Study Notes
Programming · 30 topics
ProgrammingApache Flink Study Notes
Programming · 30 topics
ProgrammingHadoop Study Notes
Programming · 30 topics
ProgrammingSnowflake Study Notes
Programming · 30 topics
ProgrammingApache Airflow Study Notes
Programming · 30 topics
Programmingdbt (Data Build Tool) Study Notes
Programming · 30 topics