嵌入式解决方案的辅助功能

使用 Power BI 时,请考虑让可能与之交互的不同类型的用户访问嵌入报表。 使报表更易于访问的几种简单方法是使用 titletabindex 属性、键盘快捷方式和高对比度模式。

如何使用 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 属性

人员可以使用其键盘在嵌入报表中导航。 可以使用 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 报表中的高对比度模式

为了帮助有视觉或身体障碍的用户从嵌入式报表中获益,你可以将其设置为使用高对比度主题。

可以通过向应用程序的嵌入配置添加单个参数来设置高对比度模式。

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

可用的对比度模式包括:

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

默认为 None = 0

重要

如果同时提供高对比度模式和主题,Power BI 将仅应用高对比度模式。 它不能同时应用两者。

调整 Power BI 报表的缩放级别

为了帮助有视觉或物理障碍的用户从嵌入的报表中获益,可以将报表缩放级别调整为高于或低于默认级别。

可以通过向嵌入设置添加单个参数或在报表加载后使用 setZoom API 来设置报表的缩放级别。

缩放级别是根据报表的实际大小计算的。 若要详细了解 报表显示 选项,请参阅更改报表页的显示。

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

若要获取当前缩放级别或在报表加载后进行更改, getZoom 可以使用 和 setZoom API。

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

注意

缩放级别必须介于 0.25 (25%) 和 4 (400% ) 之间。