Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Earn the coveted Fabric Analytics Engineer certification. 100% off your exam for a limited time only!

Reply
julianmbs
Frequent Visitor

Power BI Embedded report does not respond well

Hi,

 

I have embedded a simple Power BI report (using Import Data option) in my ASP.NET application, and it displays fine. But when I try to click on something, there is a problem. If I try to change the tab, nothing happens. If I click on one of the bars on a chart, one of them reacts as usual (it slices the rest of the visuals on the page), but clicking on others provides no response at all. Right-clicking on one bar shows the tooltip and "See Records" option, and right-clicking on another shows the standard browser menu. Both the tooltip and "See Records" are not displayed clearly.

 

Here is the chart in Power BI Desktop:

Power Bi Desktop.png

 

Here is the same chart in Power BI Embedded:

Embedded1.pngEmbedded2.png

 

Other charts do the same thing. Other reports do the same thing. I have tried both IE and Chrome, it looks the same. What could be the problem?

 

 

Thanks,

Julia

2 REPLIES 2
jocaplan-MSFT
Employee
Employee

It feels like something could be in the way. Any chance that some part of your applications UI is covering part of the iframe?

No, there shouldn't be anything in the way. It's a simple page that shows company logo and a few links to reports on the left side, and iframe on the right side. When a link on the left is clicked, the iframe loads the report. I was using this sample.

 

 

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
// Update embed report
function updateEmbedReport() {
// Check if the embed url was selected
var embedUrl = document.getElementById('<%=tb_EmbedURL.ClientID%>').value;
// To load a report do the following:
// 1: Set the url
// 2: Add a onload handler to submit the auth token
var iframe = document.getElementById('iFrameEmbedReport');
iframe.src=embedUrl;
iframe.onload = postActionLoadReport;
}
// Post the auth token to the iFrame. 
function postActionLoadReport() {
// Get the app token.
accessToken = document.getElementById('<%=hidReportAppToken.ClientID%>').value;
// Construct the push message structure
var m = { action: "loadReport", accessToken: accessToken };
message = JSON.stringify(m);
// Push the message.
iframe = document.getElementById('iFrameEmbedReport');
iframe.contentWindow.postMessage(message, "*");
}
</script>

<div style="overflow:hidden; height:100%">
<table width="100%" height="100%" cellspacing="0" cellpadding="0"><tr><td width="300" height="100%" style="background-color:#124C8F" valign="top">
<br />
<div align="center"><img src="images/NMBS-logo.png" width="200" /></div>
<br /><br /><br /><br />
<asp:Panel ID="PanelReports" runat="server" Visible="true">
<table width="100%" cellpadding="4" border="0"><tr><td valign="top">
<asp:PlaceHolder runat="server" ID="ContentReportLinks"></asp:PlaceHolder>
</td></tr></table>
<asp:HiddenField ID="hidReportAppToken" runat="server"></asp:HiddenField>
<input type="hidden" id="tb_EmbedURL" style="width: 1024px;" runat="server" />
</asp:Panel>

</td>
<td>

<iframe ID="iFrameEmbedReport" src="" height="100%" width="100%" frameborder="0" seamless></iframe>
</td></tr></table>
</div>
</asp:Content>

 

 

Helpful resources

Announcements
April AMA free

Microsoft Fabric AMA Livestream

Join us Tuesday, April 09, 9:00 – 10:00 AM PST for a live, expert-led Q&A session on all things Microsoft Fabric!

March Fabric Community Update

Fabric Community Update - March 2024

Find out what's new and trending in the Fabric Community.