Power BI Embed Report with Examples

Power BI is a powerful tool for data analysis and visualization, offering robust features for creating interactive reports and dashboards. One of the key features is the ability to embed Power BI reports in your applications or websites. This allows businesses to deliver personalized, interactive insights directly to users within their own platforms.

What is Power BI Embed?

Power BI Embed enables developers to integrate Power BI reports, dashboards, and tiles into their own web applications or internal portals. With embedded analytics, you can provide users with rich, interactive data visualizations without them having to navigate the Power BI interface. This is especially useful for organizations that want to share insights without requiring everyone to have a Power BI license.

Why Use Power BI Embedding?

Embedding Power BI reports brings several advantages to businesses and their users:

Seamless User Experience: Users interact with reports directly within your app or website, eliminating the need to switch between multiple platforms.
Customization: You can customize the look and feel of the embedded reports to match your branding and design.
Security: Power BI embed offers robust security options to ensure only authorized users can view the reports.
Interactive Reports: Users can filter, drill down, and interact with reports in real time.

Prerequisites for Embedding Power BI Reports

Before embedding a Power BI report, there are a few prerequisites:

Power BI Service Account: You need a Power BI Pro or Premium Per User (PPU) account to access the Power BI service.
Embed Token: This token authenticates users and grants them access to specific reports and dashboards.
Power BI Report: The report you want to embed must be published in Power BI Service.
Application Registration: Register your app in Azure Active Directory to generate an App ID and Secret for embedding.

Steps to Embed a Power BI Report

To embed a Power BI report, follow these steps:

1. Register Your Application in Azure AD

Start by registering your application in Azure Active Directory. This step provides the necessary credentials to authenticate users when they access your embedded reports.

Go to the Azure Portal and navigate to Azure Active Directory.
Select App registrations and click on New registration.
Name your app, set the redirect URI (usually your app’s URL), and click Register.

Once registered, make note of the Application (client) ID and Directory (tenant) ID as you’ll need these later.

2. Set Up Power BI API Permissions

To allow your application to interact with Power BI, you must assign the correct permissions:

Navigate to API Permissions in your Azure app registration.
Add Power BI Service under APIs my organization uses.
Assign Dataset and Report permissions to your app.

3. Generate the Embed Token

To authenticate users and provide them access to the reports, you’ll need to generate an embed token. This token can be generated via the Power BI REST API or Power BI SDK.

Here’s a basic example using the Power BI REST API to generate an embed token:

POST https://api.powerbi.com/v1.0/myorg/reports/{reportId}/GenerateToken
Authorization: Bearer {accessToken}
Content-Type: application/json

{
  "accessLevel": "View"
}

The response will include an embed token that you will use to display the report in your application.

4. Embed the Report in Your Application

Now, you’re ready to embed the Power BI report in your web application. Use the Power BI JavaScript Client API for this task. Here’s an example of how to embed a report in an HTML page:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Power BI Embed Example</title>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/powerbi.min.js"></script>
</head>
<body>
    <div id="embedContainer" style="height:600px;"></div>
    <script>
        var embedConfig = {
            type: 'report',
            tokenType: models.TokenType.Embed,
            accessToken: 'YOUR_EMBED_TOKEN',
            embedUrl: 'https://app.powerbi.com/reportEmbed?reportId=YOUR_REPORT_ID',
            id: 'YOUR_REPORT_ID',
            permissions: models.Permissions.All,
            settings: {
                filterPaneEnabled: false,
                navContentPaneEnabled: true
            }
        };
        var embedContainer = document.getElementById('embedContainer');
        var report = powerbi.embed(embedContainer, embedConfig);
    </script>
</body>
</html>

Example Use Case for Embedding Power BI Reports

Let’s say you run a retail business and want to share sales data with your managers. Instead of giving them access to Power BI itself, you can embed a sales performance report within your custom dashboard. This embedded report will allow managers to view interactive data, filter the results, and even drill down into specific regions or products. All of this can be done directly from the custom app without leaving the environment.

Customizing the Embedded Report

You can further customize the embedded reports using the Power BI JavaScript API. For example:

Apply Filters: You can pre-apply filters to the report, so users see only relevant data when the report is loaded.
Interact with the Report: Use the API to capture user interactions, such as clicks on a specific chart or filter changes.
Update the Report: Dynamically update the report’s data or refresh it without requiring the user to reload the page.

Here’s an example of how to apply a filter to the embedded report:

var filter = {
    $schema: "http://powerbi.com/product/schema#basic",
    target: {
        table: "Sales",
        column: "Region"
    },
    operator: "In",
    values: ["North America"]
};

report.setFilters([filter]);

This will ensure that when the report is displayed, it only shows data for the “North America” region.

Conclusion

Embedding Power BI reports is a great way to share business intelligence directly within your applications. It allows users to interact with reports and dashboards without needing a separate Power BI account. By following the steps above and using the Power BI JavaScript API, you can seamlessly integrate data visualizations into your web applications, providing valuable insights in a user-friendly, customizable format.