Skip to main content
cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Search instead for 
Did you mean: 

The Power BI Data Visualization World Championships is back! Get ahead of the game and start preparing now! Learn more

Reply
Pitchaimuthu
Helper II
Helper II

how to handle the power bi embedded tile action using javascript?

‎04-13-2017 06:34 AM

I have embedded Power BI tile into web application using javascript. Tile loaded perfectly but when we click on the tile nothing happen in the tile. I need when the user click on the tile it should show like clicked bar only active others should be inactive mode.

Please give how to do this. here below is my code.

var width = 800;
var height = 600;
var embedTileUrl = "https://app.powerbi.com/embed?dashboardId=a36a459767f437-c8cc539ce78e&tileId=f541e144-4sdsd389e-bc03...";

window.onload = function () {
updateEmbedTile();
};

function updateEmbedTile() {
if ("" === embedTileUrl)
return;
iframe = document.getElementById('iFrameEmbedTile');
iframe.src=embedTileUrl + "&width=" + width + "&height=" + height;
iframe.onload = postActionLoadTile;
}

function postActionLoadTile() {
 var accessToken = 'eMNksdOnasdfCJhbGciOiJSUzI1NiIsIng1dCI6ImEzUU4wQlpTN3M0bk4tQmRyam..............................................;
if ("" === accessToken)
return;
var h = height;
var w = width;
var m = { action: "loadTile", accessToken: accessToken, height: h, width: w };
message = JSON.stringify(m);
iframe = document.getElementById('iFrameEmbedTile');
iframe.contentWindow.postMessage(message, "*");
}

 

<body>
<div>
<iframe id="iFrameEmbedTile" src="" height="900" width="900" frameborder="0" seamless></iframe>
</div>
</body>

Labels:
Message 1 of 7
2,313 Views
0
6 REPLIES 6
Eric_Zhang
Microsoft Employee
Microsoft Employee

‎04-18-2017 05:39 AM
@Pitchaimuthu wrote:

I have embedded Power BI tile into web application using javascript. Tile loaded perfectly but when we click on the tile nothing happen in the tile. I need when the user click on the tile it should show like clicked bar only active others should be inactive mode.

@Pitchaimuthu

It is by design that the tiles don't have interaction as you described. You can check this idea Interactive dashboard tiles and vote it up.

 

The workaround can be embedding a dashboard with live page or embedding a report instead.

Message 2 of 7
2,300 Views
0
Pitchaimuthu
Helper II
Helper II
In response to Eric_Zhang

‎04-18-2017 07:31 AM

Thank you @Eric_Zhang. could you help me? I have facing one more issues in Power BI embedded. I have embedded Power BI Report, but when I execute the application in IE browser that the drill down option does not shown in IE, but others browser showing the drill down option in report.

Message 3 of 7
2,296 Views
0
Eric_Zhang
Microsoft Employee
Microsoft Employee
In response to Pitchaimuthu

‎04-18-2017 07:43 PM
@Pitchaimuthu wrote:

Thank you @Eric_Zhang. could you help me? I have facing one more issues in Power BI embedded. I have embedded Power BI Report, but when I execute the application in IE browser that the drill down option does not shown in IE, but others browser showing the drill down option in report.

@Pitchaimuthu

Could you be more specific on the visual? Or perhaps you can provide the pbix to help reproduce the issue? Once the issue identifed, I'll escalate it to the product team.

Message 4 of 7
2,291 Views
0
Pitchaimuthu
Helper II
Helper II
In response to Eric_Zhang

‎04-19-2017 08:57 AM

Thank you @Eric_Zhang for your response. I have used the clustered bar chart in embedded report. I could see the drill down option in other browser, but IE browser does not show the drill down, maximize menu, export option. below I have attached my screens.drill down.png 

Message 5 of 7
2,288 Views
0
Eric_Zhang
Microsoft Employee
Microsoft Employee
In response to Pitchaimuthu

‎04-19-2017 07:44 PM
@Pitchaimuthu wrote:

Thank you @Eric_Zhang for your response. I have used the clustered bar chart in embedded report. I could see the drill down option in other browser, but IE browser does not show the drill down, maximize menu, export option. below I have attached my screens.drill down.png 

@Pitchaimuthu

I can't reproduce that behavior. When I hover the mouse on the visual, the "drill" button just shows up, both in IE(ver IE11) and Chrome. What is your IE version and how you embed the reports? By the way, the snapshot looks more like a tile embedded other than a report, drilling down is not supported in a tile anyway.

 

In my case, I test with a static HTML.

<html>

 <script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/jquery/dist/jquery.js"></script>

<script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/powerbi-client/dist/powerbi.js"></script>
 
<script type="text/javascript">
window.onload = function () {  
 

var embedConfiguration = {
    type: 'report',
    accessToken: 'yourTokenHere',
    embedUrl: 'https://app.powerbi.com/reportEmbed?reportId=8067fc7f-xxxxxx4234ac5a984e' 

}; 
 

var $reportContainer = $('#reportContainer');
 
var report = powerbi.embed($reportContainer.get(0), embedConfiguration);
 
}
</script>

<div id="reportContainer" ></div>

</html>
Message 6 of 7
2,283 Views
0
Pitchaimuthu
Helper II
Helper II
In response to Eric_Zhang

‎04-20-2017 02:55 AM

Thank you @Eric_Zhang for your response. I have used the IE browser version 11.

I have embedded report only, not in a single tile. In our requirement, we need to have Power BI dashboard need to embedded in asp.net application. So that I have tried single tile, But I could not able get the drill down option when I embedded in single tile. So that I have created single widget in single report, like that I have created all widget in each report. And also I got another issues on a single report with single widget, When I click on a report(widget) it does not affect another report(widget). I could understand, I have embedded each widget in seperate report so that it does not affect. So please give me this also, how to do this?..

Message 7 of 7
2,277 Views
0

Helpful resources

Announcements
Power BI DataViz World Championships

Power BI Dataviz World Championships

The Power BI Data Visualization World Championships is back! Get ahead of the game and start preparing now!

December 2025 Power BI Update Carousel

Power BI Monthly Update - December 2025

Check out the December 2025 Power BI Holiday Recap!

FabCon Atlanta 2026 carousel

FabCon Atlanta 2026

Join us at FabCon Atlanta, March 16-20, for the ultimate Fabric, Power BI, AI and SQL community-led event. Save $200 with code FABCOMM.

View All