ブートストラップを使用してパフォーマンスを向上する

powerbi.bootstrap は、開発者が Power BI エンティティをより迅速に埋め込み、パフォーマンスを向上させるために、クライアント SDK バージョン 2.9.0 で導入された方法です。

powerbi.embed を使用してレポートを埋め込むには、reportId、embedURL、accessTokenなど、複数のパラメーターが必要です。 これらのパラメーターは、常にすぐに使用できるわけではありません。

powerbi.bootstrap を使用すると、必要なすべてのパラメーターを使用できるようになる前に埋め込みを開始できます。 ブートストラップ API は、iframe を準備して初期化します。

必要なパラメーターを受け取った後、同じ HTML 要素で powerbi.embed(element, config) を呼び出す必要があります。

Bootstrap API

powerbi.bootstrap(element, config) メソッドは、powerbi.embed(...)と同じ要素と構成を受け取ります。

/**
    * Given an HTML element and entityType, creates a new component instance, and bootstrap the iframe for embedding.
    *
    * @param {HTMLElement} an HTML Element where you need to embed. must be the same div element you will use in powerbi.embed.
    * @param {IBootstrapEmbedConfiguration} config: a bootstrap config.
    */
bootstrap(element: HTMLElement, config: IBootstrapEmbedConfiguration): embed.Embed;

ブートストラップ埋め込み構成

interface IBootstrapEmbedConfiguration {
  type: string;
  hostname?: string;
  embedUrl?: string;
  settings?: ISettings;
}

構成パラメーター:

• 種類 (必須): 埋め込むエンティティの種類 ("レポート"、"ダッシュボード"、"タイル"、"qna"、"ビジュアル" など)。
• ホスト名: まだ embedURL がない場合は、ホスト名を指定できます。 ホスト名は、埋め込み URL のドメイン名です。 たとえば、埋め込み URL が 'https://app.powerbi.com/reportEmbed' の場合、ホスト名は 'https://app.powerbi.com/' です。 hostname または embedUrl が指定されていない場合は、既定のホスト名 (https://app.powerbi.com/) が使用されます。
• embedUrl: 後で powerbi.embed に指定するのと同じ埋め込み URL。 hostname または embedUrl が指定されていない場合は、既定のホスト名 (https://app.powerbi.com/) が使用されます。
• 設定: モバイル レイアウトにレポートを埋め込むか、ロケール (言語) を指定するには、これらのパラメーターを初期設定に含めます。

ブートストラップのサンプル

次のサンプルでは、Power BI エンティティを埋め込む際のブートストラップ メソッドのリファレンスを示します。

レポートを埋め込むためのブートストラップを実行するには:

powerbi.bootstrap(
        reportContainerDivElement,
        {
            type: 'report',
        }
    );

ダッシュボードを埋め込むためのブートストラップを実行するには:

powerbi.bootstrap(
        reportContainerDivElement,
        {
            type: 'dashboard',
            embedUrl: "https://app.powerbi.com/dashboardEmbed?dashboardId=06e3ba63-47ea-4579-b010-fdb5484b325a&config=eyJjbHVzdGVyVXJsIjoiaHR0cHM6mLndpbmRvd3MubmV0In0="
        }
    );

ホスト名のみを使用してレポートを埋め込むためのブートストラップを行う場合:

powerbi.bootstrap(
        reportContainerDivElement,
        {
            type: 'report',
            hostname: "https://app.powerbi.com"
        }
    );

モバイル レイアウトでレポートを埋め込むためのブートストラップを実行するには:

powerbi.bootstrap(
        reportContainerDivElement,
        {
            type: 'report',
            hostname: "https://app.powerbi.com",
            settings: {
	            layoutType: models.LayoutType.MobilePortrait
            }
        }
    );

制限

• 次のブートストラップされたエンティティは、powerbi.reset(element)を呼び出さなければ変更できません。

  • コンポーネントの種類 (レポート、ダッシュボード): たとえば、レポートをブートストラップする場合は、同じ HTML 要素にのみレポートを埋め込むことができます。
  • レイアウト (デスクトップ/モバイル)
  • ロケール (言語)

• ページ分割されたレポートを埋め込む場合、powerbi.bootstrap メソッドはサポートされません。

関連コンテンツ

• レポート を埋め込む

• Power BI 埋め込み分析のパフォーマンスのベスト プラクティス

• レポート設定の構成