포함된 솔루션에 대한 접근성
Power BI를 사용할 때는 임베디드 보고서를 상호 작용할 수 있는 다양한 유형의 사용자가 액세스할 수 있도록 하는 것이 좋습니다. 보고서의 접근성을 높이는 몇 가지 쉬운 방법은 title
및 tabindex
특성, 바로 가기 키 및 고대비 모드를 사용하는 것입니다.
제목 및 tabindex 특성을 사용하는 방법
powerbi.embed
또는 powerbi.bootstrap
메서드를 호출한 후 포함된 형식의 구성 요소를 가져옵니다.
Title 특성
title
특성을 사용하면 해당 특성이 속한 요소에 텍스트를 추가할 수 있습니다. 다른 사용자가 화면 읽기 프로그램을 사용하는 경우 해당 요소에 대한 추가 정보를 읽습니다. embed 구성 요소의 title
특성을 설정하려면 setComponentTitle
사용합니다.
setComponentTitle(title: string): void
타이틀 특성 예제
let component = powerbi.embed(…);
component.setComponentTitle(“Analytics report”);
title
특성에 대한 자세한 내용은 MDN Web Docs제목 문서를 참조하세요.
Tabindex 특성
사용자는 키보드를 사용하여 포함된 보고서를 탐색할 수 있습니다.
tabindex
특성을 사용하여 사용자가 Tab누를 때 건너뛸 수 있는 탭 포커스를 보고서의 요소에 추가할 수 있습니다. embed 구성 요소의 tabindex
특성을 설정하려면 setComponentTabIndex
사용합니다.
setComponentTabIndex(tabIndex?: number): void
removeComponentTabIndex
사용하여 tabindex
특성을 제거할 수 있습니다.
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 보고서의 확대/축소 수준 조정
시각 또는 신체 장애가 있는 사용자가 포함된 보고서의 혜택을 받을 수 있도록 보고서 확대/축소 수준을 기본 수준보다 높거나 낮게 조정할 수 있습니다.
embed 설정에 단일 매개 변수를 추가하거나 보고서가 로드된 후 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%) 사이여야 합니다.