Setting on portal
Display (Embed) Power BI report in Angualr UI
Create report in PowerBI
refer: https://docs.microsoft.com/en-us/power-bi/developer/embedded/embed-sample-for-customers https://www.youtube.com/watch?v=0y2oJikC6Xc
Power BI web portal: https://app.powerbi.com/
Create workspace
Create workspace
Workspace->Create a workspace->New --> name[wiseclient] Enable access -> from the More menu, select Workspace access. --> PowerBIGroup ->select Admin ->Add
Update Credentials: Report, mouse right, [Setting]: clicked on Edit Credentials and simply pressed Sign-in.
Change referesh time [Setting]: select 15 minutes on Scheduled referesh
Design report in PowerBI Desktop
Power BI Desktop -
Copy weight-report.pbix and weight-vision.pbix,
open .pbix use Power BI Desktop
select WEIGHTING on right side, ... edit query,
Press Source, change Server and Database with new (Azure SQL) Server: tcp:nwiapps.database.windows.net,1433 Database: user name, password -- some columns may need to update
*** Do not switch all tables to import mode ***
or Create new Power BI app: new -> Get Data -> A. select SQL Server database -> Server: tcp:nwiapps.database.windows.net,1433 Database: **
Data Connectivity mode: DirectQuery
Select Table -> Transform Data
or B. select Azure Data Explorer (Kusto)-> -> Connect: cluster: https://nwiiot.australiaeast.kusto.windows.net
Data Connectivity mode: DirectQuery
-> Ok
DATABASE: [WISE_4250] -> Transform Data
Data type convert and design:
Change (ABC)change type->(1.2)Decimal Number,
= Table.TransformColumnTypes(Speed1,{{"Speed", type number}})
add text fillter (Enabled equal 1)
= Table.SelectRows(#"Changed Type", each [SpeedEnabled] = "1")
close & apply
add field and select visualizations
2. Publish to new workspace that created by Power BI web portal, replace (if has existed)
[GroupId],[ReportId] - PowerBI
Open PowerBI portal, Select new report has created by Power BI Desktop
URL example: https://app.powerbi.com/groups/###########/reports/@@@@@@@@@@@@/ReportSection
GroupId(Workspace): (afer ../groups/): ########### ReportId: (after ../reports/): @@@@@@@@@@@@
Update [GroupId] and [ReportId] in constants.ts (Angular UI)
Add API access
In new workspace, => Access entry PowerBIGroup => Add
select right top ... > Settings > Settings Datasets=> Scheduled refresh : 15 minutes
select right top ... > Settings > Admin portal. Select Tenant settings and then scroll down to the Developer settings section. Expand Allow service principals to use Power BI APIs, and enable this option.
Group -> [PowerBIGroup] => Add members -> new workspace name has created
App Registration in Azure portal
refer: https://docs.microsoft.com/en-us/azure/active-directory/develop/scenario-spa-app-registration https://docs.microsoft.com/en-us/power-bi/developer/embedded/embed-sample-for-customers?tabs=net-core
Azure portal: https://portal.azure.com/
Registration and Authentication
A. Register an applicatioin
Search for App registrations:
+ New registration:
Register an applicatioin:
==> Name: @@@@
==> Register
B. Add Authentication URL
Select just registed app @@@@=>
[Manage]->Authentication->Add a platform
==>Select Web
Add Redirect URIs:
https://localhost:5002
https://*****auth.azurewebsites.net/
==>Configure
C. Add API permissions
Select just registed app @@@@=>
[Manage]=> API permissions.
New window, select Power BI Service.
=>Select Delegated permissions.
=>Select the permissions
Add permissions below:
Microsoft Graph (1)
User.Read
Power BI Service (16)
App.Read.All
Capacity.Read.All
Capacity.ReadWrite.All
Content.Create
Dashboard.Read.All
Dashboard.ReadWrite.All
Dataset.Read.All
Dataset.ReadWrite.All
Gateway.Read.All
Gateway.ReadWrite.All
Report.Read.All
Report.ReadWrite.All
StorageAccount.Read.All
StorageAccount.ReadWrite.All
Workspace.Read.All
Workspace.ReadWrite.All
... may need more ....
==>Save
[ApplicationId],[TenantId],[SecretId]
1. Select just registed app @@@@=> Oveview
=> [Application (client) ID]
=> [Directory (tenant) ID]
2. [Manage] =>
Certificates & secrets ->
+ New client secret,
==> description and select 24 months
==> Add
Get [Value] ---> is Secret value
Update appsettings.json in WWWebApp
"applicationId": ===>[Application (client) ID]
"tenant": ====>[Directory (tenant) ID]
"applicationSecret": =====> [Secret ID]
run API App to test embedUrl and accessToken
Update by Steven, July 2022
Last updated
Was this helpful?