ngx-powerbi — A basic TypeScript wrapper library for Power BI

Power BI is an amazing data visualization tool which allows one to connect to a plethora of data sources and visualize data in any way imaginable. It also allows one to embed the visualizations in any web application. By embedding the visualizations in a web page, developers can offer a seamless experience to the end users where the users can drill-down through the visualized data without knowing anything about Power BI.

Angular + Power BI

Angular and React frameworks are gaining a lot of traction in web development these days. With the advent of TypeScript, the way we used to develop web apps has drastically changed. With TypeScript, we can use most of the Object Oriented Programming concepts and thus make our application code easily understandable and maintainable.

Embedding Power BI into an Angular application

Microsoft provides a REST API and a JavaScript SDK for embedding Power BI reports and dashboards in web applications. Both of these approaches are wonderful but have a drawback in case we want to use these in an Angular application written in TypeScript. Microsoft provided a TypeScript wrapper library for Angular 1 but there is no official library for Angular 2+.

ngx-powerbi

I have created a Power BI Embedding library for Angular 6+. The library can be installed using the following command:

npm install ngx-powerbi

Here are the relevant links:

NPM: https://www.npmjs.com/package/ngx-powerbi

GitHub: https://github.com/ramandeep-singh-1983/ngx-powerbi

This is a pretty basic wrapper but does its’ job well. There are multiple ways of embedding Power BI stuff through the library and all are documented in the README.

Wrap up

Feel free to use the library and post your feedback about the same. I will try to include any feature requests and fix the defects (if any). Thanks for reading!