埋め込みソリューションのアクセシビリティ

Power BI を使用する場合は、さまざまな種類のユーザーが埋め込みレポートにアクセスできるようにすることを検討してください。 レポートのアクセシビリティを高めるいくつかの簡単な方法は、 属性と tabindex 属性、キーボード ショートカット、ハイ コントラスト モードを使用titleすることです。

title 属性と tabindex 属性を使用する方法

または メソッドをpowerbi.embedpowerbi.bootstrap呼び出すと、埋め込んだ型のコンポーネントが取得されます。

Title 属性

title属性を使用すると、属する要素にテキストを追加できます。 スクリーン リーダーを使用しているユーザーは、その要素に関する追加情報を読み取ります。 埋め込みコンポーネントの 属性を title 設定するには、 を使用します setComponentTitle。

setComponentTitle(title: string): void

Title 属性の例

let component = powerbi.embed(…);
component.setComponentTitle(“Analytics report”);

属性の title 詳細については、 MDN Web Docsのタイトル に関する記事を参照してください。

Tabindex 属性

Peopleキーボードを使用して、埋め込みレポート内を移動できます。 属性を tabindex 使用して、ユーザーが Tab キーを押したときにスキップされる、レポート内の要素に タブ付きフォーカスを追加できます。埋め込みコンポーネントの 属性を tabindex 設定するには、 を使用します setComponentTabIndex。

setComponentTabIndex(tabIndex?: number): void

属性を削除するには、 を tabindex 使用します。 removeComponentTabIndex

removeComponentTabIndex(tabIndex?: number): void

Tabindex 属性の例

let component = powerbi.embed(...);
component.setComponentTabIndex(0);

属性の tabindex 詳細については、 MDN Web Docstabindex に関する記事を参照してください。

埋め込み Power BI レポートのキーボード ショートカット

キーボードを使用して埋め込みレポートを調べるユーザーにとって、キーボード ショートカットの一覧は非常に重要なツールです。 キーボード ショートカットを表示する場合は、埋め込みレポートにフォーカスを置き、Shift+ キーを押します。

詳細については、「Power BI Desktopのキーボード ショートカット」を参照してください。

埋め込み Power BI レポートのハイ コントラスト モード

埋め込みレポートを使用して視覚または身体の障害を持つユーザーのメリットを得るために、ハイ コントラスト テーマを使用するように設定できます。

ハイ コントラスト モードを設定するには、アプリケーションの埋め込み構成に 1 つのパラメーターを追加します。

let embedConfig = {
    …
    contrastMode: models.ContrastMode.HighContrast1
};

使用できるコントラスト モードは次のとおりです。

enum ContrastMode {
    None = 0,
    HighContrast1 = 1,
    HighContrast2 = 2,
    HighContrastBlack = 3,
    HighContrastWhite = 4
}

既定値は、None = 0 です。

重要

ハイ コントラスト モードとテーマの両方を指定した場合、Power BI ではハイ コントラスト モードのみが適用されます。 両方を同時に適用することはできません。

Power BI レポートのズーム レベルを調整する

埋め込みレポートの視覚障蘦または身体障蘥を持つユーザーのメリットを得るために、レポートのズーム レベルを既定のレベルよりも高くまたは低く調整できます。

埋め込み設定に 1 つのパラメーターを追加するか、レポートの読み込み後に API を使用して、レポートの setZoom ズーム レベルを設定できます。

ズーム レベルは、レポートの実際のサイズに基づいて計算されます。 レポートの表示オプションの詳細については、「レポート ページの表示を変更する」を参照してください。

let embedConfig = {
    …
    settings: {
        zoomLevel: 2 // 200% zoom
    }
};

現在のズーム レベルを取得したり、レポートの読み込み後に変更したりするには、 API と setZoom API を使用getZoomできます。

let currentZoom = await report.getZoom();
await report.setZoom(0.5); // 50% zoom

Note

ズーム レベルは、0.25 (25%) から 4 (400%) の間である必要があります。

関連コンテンツ

• Power BI Desktop のキーボード ショートカット
• アクセシビリティ対応の Power BI レポートを設計する
• レポート設定の構成
• レポートテーマを適用する