对嵌入式Power BI报告中的可视化进行排序

Question

我想使用Jquery对Embedded Power BI中的报表中的视觉效果进行排序。作为一种变通方法，我尝试将一个唯一的id添加到Visuals的标签中，这样我以后就可以根据它们的id对Visuals进行排序了。因此，我试图穿透下面的#文档。

$("iframe").each(function () {
var ifrm = $(this);
var win = ifrm.contentWindow;
var doc = ifrm.contentDocument ? ifrm.contentDocument :
ifrm.contentWindow.document;
});

然而，由于无法访问#文档中的标记元素，我获得了未定义的win。

有人能建议我们是否可以访问这个#文档并操作Visuals的顺序吗。或者，在Embedded Power BI中，是否有其他方法可以使用javascript/jquery对报表中的可视化进行排序。我尝试了各种Jquery方法的组合来访问这个Iframe中的类。

Answer 1

您不能使用jQuery/JavaScript访问报表(iframe(中的元素。

通常，视觉效果会按照使用Power BI Desktop或Service添加的顺序显示在报告中。如果你想让你的视觉效果按排序顺序出现，你必须制作另一个页面，并按你想要的顺序添加视觉效果，然后在需要时将该页面设置为活动页面。

请按照以下代码片段将您所需的页面设置为活动页面：

1. 获取对包含嵌入报表的HTML元素的引用：

   const embedContainer = $('#embedContainer')[0];
   

2. 嵌入report:

   const report = powerbi.embed(embedContainer, embedConfig);
   

3. 获取页面列表：

   const pages = await report.getPages();
   const pageNumber = 2 /// Your required page number
   

4. 将所需页面设置为活动页面：​

   await pages[pageNumber].setActive();
   console.log("Active page was set to: + pages[pageNumber].displayName);
   

请在下面找到参考资料：
https://learn.microsoft.com/javascript/api/overview/powerbi/page-navigation