通过

嵌入仪表板

  • 项目

本文介绍在应用程序中嵌入仪表板的步骤。 Power BI 设计器仪表板简介中了解有关仪表板的详细信息。

提示

请尝试在 “浏览 Power BI Embedded Analytics Playground 部分的 API 中嵌入仪表板或试验客户端 API。

如何嵌入仪表板

在应用中嵌入 Power BI 内容时，使用配置对象定义要嵌入的内容并指定内容的设置。 然后将该对象传递给 API。

嵌入仪表板时，请使用 IDashboardLoadConfiguration类型的配置对象：

interface IDashboardLoadConfiguration {
    accessToken: string;
    embedUrl?: string;
    id: string;
    pageView?: models.PageView 
    tokenType?: models.TokenType;
    type: string;
}

此接口包含以下属性：

  • accessToken - 用于访问要嵌入的 Power BI 数据的令牌。 请参阅 了解不同的嵌入解决方案 了解有关访问令牌的详细信息。

  • embedUrl - 要嵌入的仪表板的 URL。 此 URL 将成为包含嵌入仪表板的 HTML iframe 元素的源。 具体而言，API 将 URL 分配给 iframe的 src 属性。 可以使用 仪表板 API 来获取此 URL。 两个示例包括：

  • id - 要嵌入的仪表板的 ID。 使用 仪表板 API 获取此 ID。 例如：

  • pageView - API 用于嵌入式仪表板的格式。 可能包括：

    • fitToWidth - 嵌入仪表板的宽度与包含仪表板的 div 元素的宽度匹配。
    • oneColumn - 嵌入的仪表板显示在一列中。
    • actualSize - API 以完全大小显示嵌入式仪表板。

  • tokenType - 用于访问要嵌入的 Power BI 数据的令牌类型。

    • 使用 models.TokenType.Aad 为组织嵌入（用户拥有数据）。
    • 使用 models.TokenType.Embed 为客户嵌入（应用拥有数据）。

    有关详细信息，请参阅 了解不同的嵌入解决方案。

  • type - 要嵌入的内容类型。 对仪表板使用 'dashboard'。

例

以下示例演示如何嵌入单个仪表板：

// Set up the configuration object that determines what to embed and how to embed it.
let embedConfiguration = {
    accessToken: anAccessToken,
    embedUrl: anEmbedUrl,
    id: aDashboardId,
    pageView: 'fitToWidth',
    tokenType: aTokenType,
    type: 'dashboard'
};
 
// Get a reference to the HTML element that contains the embedded dashboard.
let dashboardContainer = $('#dashboardContainer')[0];
 
// Embed the dashboard.
let dashboard = powerbi.embed(dashboardContainer, embedConfiguration);

注意事项和限制

  • 不支持在 EM SKU 上嵌入仪表板

  • 嵌入内容时，应用会在 div 元素中显示内容。 如果在嵌入仪表板时使用 pageView 值 actualSize：

    • 如果仪表板比 div 元素宽，则 API 使用 div 元素的宽度作为嵌入仪表板的宽度。
    • 如果仪表板比 div 元素窄，API 会用嵌入背景填充未使用的空间。 默认情况下，该背景为白色，但你可以将其配置为透明。 在这种情况下，div 元素的样式在未使用的空间中可见。

相关内容