Hi,
We have a multipage report published to PowerBI Premium work space (App Workspace).
We are using below code to embed the report into web application.
But pageName is set to specific page of the report and settings are set as below, it still shows the default page only. What could be wrong?
pageName: 'Page3',
settings: {
filterPaneEnabled: false,
navContentPaneEnabled: false
}
This shows Page1 though we are forcing to show Page3. Page1 is our default page of the report.
<script src="~/jquery-1.9.1.min.js"></script>
<script src="~/adal.min.js"></script>
<script src="~/powerbi.js"></script>
<script type="text/javascript">
(function() {
"use strict";
var subscriptionId = 'tenantname.onmicrosoft.com';
// Copy the client ID of your AAD app here once you have registered one, configured the required permissions, and
// allowed implicit flow https://msdn.microsoft.com/en-us/office/office365/howto/get-started-with-office-365-unified-api
var clientId = 'guid';
var config = {
subscriptionId: subscriptionId,
clientId: clientId,
postLogoutRedirectUri: window.location.origin,
resource: 'https://analysis.windows.net/powerbi/api',
prompt: 'none',
cacheLocation: 'localStorage', // enable this for IE, as sessionStorage does not work for localhost.
embedUrlBase: 'https://app.powerbi.com/reportEmbed',
reportId: 'guid of dashboard',
groupId: 'guid of group',
response_type:'id_token'
};
// AuthenticationContext is coming from ADAL.min.js
var authContext = new AuthenticationContext(config);
// Check For & Handle Redirect From AAD After Login
var isCallback = authContext.isCallback(window.location.hash);
authContext.handleWindowCallback();
if (isCallback && !authContext.getLoginError()) {
window.location = authContext._getItem(authContext.CONSTANTS.STORAGE.LOGIN_REQUEST);
}
// If not logged in force login
var user = authContext.getCachedUser();
if (!user) {
//alert('user login required');
authContext.login();
//alert('user login completed');
}
// Acquire token for resource.
authContext.acquireToken(config.resource, function(error, token) {
// alert('acquireToken fn called');
// Handle ADAL Errors.
if (error || !token) {
alert('ADAL error occurred: ' + error);
console.log('ADAL error occurred: ' + error);
return;
}
// Store our token
config.authToken = token;
$(document).ready(function(){
var models = window['powerbi-client'].models;
// Embed configuration used to describe the what and how to embed.
// This object is used when calling powerbi.embed.
// This also includes settings and options such as filters.
// You can find more information at https://github.com/Microsoft/PowerBI-JavaScript/wiki/Embed-Configuration-Details.
var embedUrl = "https://app.powerbi.com/dashboardEmbed?reportId="+ config.reportId;
// alert(embedUrl);
var pbiconfig = {
type: 'report',
tokenType: models.TokenType.Aad,
accessToken: config.authToken,
embedUrl: embedUrl,
id: config.reportId,
pageView: 'fitToWidth',
pageName: 'Page3',
settings: {
filterPaneEnabled: false,
navContentPaneEnabled: false
}
};
var pbiconfigmessage = JSON.stringify(pbiconfig);
// Get a reference to the embedded dashboard HTML element
var dashboardContainer = $('#divDashBoardContainer')[0];
// Embed the dashboard and display it within the div container.
var dashboard = powerbi.embed(dashboardContainer, pbiconfig);
// Get a reference to the embedded dashboard.
var dashboard1 = powerbi.get(dashboardContainer);
// Displays the dashboard in full screen mode.
dashboard1.fullscreen();
// push the message.
// iframe.contentWindow.postMessage(message, "*");;
});
});
})();
</script>
<div id="divDashBoardContainer" style="height:758px; border-style: double; border-color: aqua; border-width: thick; "></div>