Hi All,
I am using Power BI JavaScript API's to integrate Power BI reports (deployed in service) into an ASP.Net MVC web application. I am stuck with below two issues. Could anyone please provide pointers on how to resolve them.
Printing issue:
I am using the below code to print a Power BI report,
// Get a reference to the embedded report HTML element
var reportContainer = $('#reportContainer')[0];
// Get a reference to the embedded report.
report = powerbi.get(reportContainer);
// Trigger the print dialog for your browser.
report.print()
.then(function (result) {
Log.log(result);
})
.catch(function (errors) {
Log.log(errors);
});
Using above the print works well in Chrome, but does not work correctly in IE 11 (version 11.0.9600.18665). It prints the entire web page (with web application menus, logo,footer etc.) instead of the iframe which holds the Power BI report.
When I right click on the report and print, then the print is some what better i.e. it prints out only the iframe but it cuts the report from left and right by some margin. I even tried to use Landscape mode instead of the Portrait but no luck.
Incidently the site https://microsoft.github.io/PowerBI-JavaScript/demo/code-demo/index.html too does not print the report correctly it prints out the whole page.
Navigate to particular page issue:
I am using the below code to navigate to a particular page in report when a user clicks on particular menu item.
// Get a reference to the embedded report HTML element
var reportContainer = $('#reportContainer')[0];
// Get a reference to the embedded report.
report = powerbi.get(reportContainer);
var menuName = "Test Page";
report.getPages()
.then(function (reportPages) {
pages = reportPages;
for (var i = 0; i < pages.length; i++) {
if(pages[i].displayName.trim() == menuName.trim())
{
pages[i].setActive();
}
}
});
However this code works well in Chrome, but in IE 11 it does not work at all. I have also tried setPage(pagename) function to achive this, but it does not work.
Thanks,
Vinayak
