You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: powerapps-docs/maker/portals/admin/add-powerbi-report.md
+20-52Lines changed: 20 additions & 52 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -5,14 +5,16 @@ author: neerajnandwana-msft
5
5
ms.service: powerapps
6
6
ms.topic: conceptual
7
7
ms.custom:
8
-
ms.date: 08/21/2020
8
+
ms.date: 09/01/2020
9
9
ms.author: nenandw
10
10
ms.reviewer: tapanm
11
11
---
12
12
13
13
# Add a Power BI report or dashboard to a web page in portal
14
14
15
-
You can add a Power BI report or dashboard to a web page in portal by using the [powerbi](../liquid/portals-entity-tags.md#powerbi) Liquid tag. You can add the tag in the **Copy** field on a web page or in the **Source** field on a web template. If you're adding a Power BI report or dashboard created in the new workspace in Power BI, you must specify the authentication type as **powerbiembedded** in the *powerbi* Liquid tag.
15
+
You can add a Power BI report or dashboard to a web page in portal by using the [powerbi](../liquid/portals-entity-tags.md#powerbi) Liquid tag. Use the `powerbi` tag in the **Copy** field on a web page or in the **Source** field on a web template.
16
+
17
+
If adding a Power BI report or dashboard created in the new workspace in Power BI, you must specify the authentication type as **powerbiembedded** in the *powerbi* Liquid tag.
16
18
17
19
> [!TIP]
18
20
> This article explains how to add a Power BI report or dashboard using *powerbi* liquid tag. To add **Power BI component** on a webpage in your portal using the portals Studio, go to [Add a Power BI component to a webpage using the portals Studio](../compose-page.md#add-power-bi).
@@ -55,9 +57,9 @@ For example:
55
57
56
58
## How to use powerbi-client JavaScript library in portals
57
59
58
-
You can use [powerbi-client JavaScript library](https://github.com/microsoft/PowerBI-JavaScript#powerbi-client) while embedding Power BI reports or dashboards in portals. See [Power BI JavaScript wiki](https://github.com/Microsoft/PowerBI-JavaScript/wiki) for more details.
60
+
You can use [powerbi-client JavaScript library](https://github.com/microsoft/PowerBI-JavaScript#powerbi-client) while embedding Power BI reports or dashboards in portals. For more information about powerbi-client JavaScript library, see [Power BI JavaScript wiki](https://github.com/Microsoft/PowerBI-JavaScript/wiki).
59
61
60
-
For example, here's a sample JavaScript that can be used to update the report settings, or to handle events. This sample disables filters pane, disables page navigation and enables *dateSelected* event.
62
+
Below is a sample JavaScript to update the report settings, or to handle events. This sample disables filters pane, disables page navigation, and enables *dataSelected* event.
61
63
62
64
```javascript
63
65
$(function(){
@@ -113,26 +115,23 @@ var report = powerbi.get(embedContainer);
113
115
114
116
### Work with Power BI panes
115
117
116
-
You can use the *Panes* related settings to work with Power BI panes on a portals web page. For example, you can use the filters setting to hide or show the pane. Or, use the paging with page navigation setting.
117
-
118
-
Panes can be updated using JavaScript directly as shared in the [previous example](#how-to-use-powerbi-client-javascript-library-in-portals), or you can use HTML with the `<div>` tags.
119
-
120
-
The following samples show how to use both methods, using JavaScript directly, or through HTML.
121
-
122
-
#### Change panes using JavaScript
118
+
You can use the settings for **Panes** to work with Power BI panes on a portals web page. For example, you can use the filters setting to hide or show the pane. Or, use the paging with page navigation setting.
123
119
124
-
To hide the Filters pane using above JavaScript sample, use the following format.
120
+
Below is the sample to remove filters pane:
125
121
126
122
```javascript
127
123
report.updateSettings({
128
124
panes: {
129
125
filters :{
130
126
visible:false
131
-
},
127
+
}
132
128
}
129
+
}).catch(function (errors) {
130
+
console.log(errors);
131
+
});
133
132
```
134
133
135
-
Similarly, if you want to work with page navigation in addition to filters:
134
+
Sample to work with both page navigation, and filters:
136
135
137
136
```javascript
138
137
report.updateSettings({
@@ -144,56 +143,25 @@ report.updateSettings({
144
143
visible:false
145
144
}
146
145
}
146
+
}).catch(function (errors) {
147
+
console.log(errors);
148
+
});
147
149
```
148
150
149
151
More information: [Update settings](https://github.com/Microsoft/PowerBI-JavaScript/wiki/Update-Settings) and [Embed configuration - Settings](https://github.com/Microsoft/PowerBI-JavaScript/wiki/Embed-Configuration-Details#settings)
150
152
151
-
#### Change panes using HTML
152
-
153
-
You can also use the attribute called `powerbi-settings-filter-pane-enabled` and set its value to `false` to hide the Filters pane. You can add this sample code in a web page's [copy (HTML)](../configure/web-page.md#web-page-attributes) attribute.
0 commit comments