# 페이지 없는 리포트
## Content
# 소개
페이지 없는 보고서는 데이터를 페이지가 지정되지 않은 방식으로 표시하기 위한 방법으로, 콘텐츠가 페이지 대신 섹션으로 분할됩니다. 이 레이아웃 유형은 PDF로 내보내기 또는 출력이 필요하지 않으면서 고도로 동적이고 상호작용 가능한 데이터 시각화에 적합합니다.
이 자습서에서는 처음부터 `페이지 없는 판매 보고서`를 구축하여 일반적인 보고서 디자인 프로세스에 대한 실습 경험을 제공합니다.
자습서를 마치면 다음을 수행할 수 있습니다.
* 새 페이지 없는 보고서 만들기
* 여러 끝점을 사용하여 보고서를 OData API에 바인딩
* OData `$select` 쿼리 옵션을 사용하여 검색된 데이터의 볼륨 줄이기
* 데이터 집합 계산 필드 만들기
* 보고서 구독자와 상호 작용하기 위한 보고서 매개 변수 만들기
* `목록` 데이터 영역과 `매개 변수 적용` 상호작용 작업을 사용하여 런타임 필터 패널을 구축합니다.
* 런타임에서 데이터를 필터링하는 `표` 및 `차트` 영역을 생성합니다.
* 스크롤 가능한 컨테이너 만들기
모든 자습서 단계를 완료하면 최종 보고서는 [라이브 데모](/activereportsjs/demos/Reports/GetStartedWithPagelessReports/purejs)와 같이 표시됩니다.
# 사전 준비 사항
이 자습서에서는 `독립 실행형 보고서 디자이너`가 실행되고 있다고 가정합니다. 독립 실행형 보고서 디자이너를 시작하는 방법에 대한 상세 설명은 [연결된 자습서](https://demo.mescius.co.kr/activereportsjs/docs/ReportAuthorGuide/QuickStart/Get-Started-With-Designer-App)를 참조하십시오. 또한 [데모 데이터 허브](https://demodata.grapecity.com/)에 액세스하려면 안정적인 인터넷 연결이 필요합니다.
# 새 보고서 작성
독립 실행형 보고서 디자이너에서 새 보고서를 작성하려면 다음 단계를 따릅니다.
1. `파일` 메뉴를 클릭합니다.
2. `새로 만들기` 옵션을 선택합니다.
3. 사용 가능한 템플릿 중에서 `페이지 없는 레이아웃` 템플릿을 선택합니다.
4. 그러면 페이지 없는 레이아웃 템플릿이 사용된 새 보고서가 생성됩니다.
# 데이터 바인딩
`데이터 바인딩`은 보고서와 보고서에 표시될 데이터 간 연결을 구축하는 절차입니다. 이 자습서에서는 [GrapeCity 데모 OData API](https://demodata.grapecity.com/swagger/index.html?urls.primaryName=OData%2520Contoso)를 사용합니다. 이 API는 `Contoso`라는 가상의 회사에 대한 매출 데이터를 포함하고 있습니다. 이 회사는 100,000개가 넘는 제품을 제조 및 판매하고 지원하는 조직입니다.
# 데이터 소스 추가
`Contoso OData API`를 루트 URL `https://demodata.grapecity.com/contoso/odata/v1`을 통해 연결할 수 있는 '데이터베이스'로 간주할 수 있습니다. 이 API는 `/DimCustomers`, `/DimStores`, `/DimProducts` 등의 끝점에서 표현되는 다수의 '표'를 제공합니다. 이 '데이터베이스'와 연결하기 위해 다음 단계를 따라 보고서 데이터소스를 생성할 수 있습니다.
1. 속성 검사자의 `데이터` 패널을 열고 `추가` 버튼을 클릭합니다.
2. `데이터 소스 편집기` 대화 상자의 `이름` 필드에는 `Contoso`를, `끝점` 필드에는 `https://demodata.grapecity.com/contoso/odata/v1`을 입력합니다.
3. `변경 사항 저장` 버튼을 클릭하여 데이터 소스 생성을 마무리합니다.
# 보충 데이터 집합 추가하기
`데이터 집합`은 한 개 이상의 `데이터 소스` 끝점을 나타냅니다. `판매 보고서`의 경우 `Contoso 데이터 소스`의 `/DimPromotions` 및 `/FactSales` 이전 섹션에서 추가한 끝점의 데이터에 액세스할 수 있어야 합니다. 첫 번째 데이터 집합은 보조적이며 이를 사용하여 판매 엔티티에 대한 할인 정보를 얻을 수 있습니다. 다음 단계에 따라 `Promotions` 데이터 집합을 추가합니다.
1. 데이터 패널에서 `Contoso` 데이터 소스 옆의 `+` 아이콘을 클릭합니다.
2. `데이터 집합 편집기` 대화 상자의 `이름` 필드에는 *Promotions*를, `Uri/경로` 필드에는 */DimPromotions*를, `Json 경로` 필드에는 `$.value.*`를 입력합니다.
3. 기본적으로 각 Promotion 레코드에는 14개의 필드가 있지만 모두 필요하지는 않습니다. 쿼리 매개 변수를 통해 OData `$select` 쿼리 옵션을 적용하여 검색되는 필드를 제한합니다.
4. 매개 변수 섹션 오른쪽에 있는 `+` 아이콘을 클릭합니다.
5. 새로 추가한 매개 변수 항목의 매개 변수 필드에 *$select*를 입력합니다.
6. 동일한 매개 변수 항목의 값 필드에 *PromotionKey, PromotionType*을 입력합니다.
7. `유효성 검사` 버튼을 클릭합니다.
8. 데이터베이스 필드 섹션에 `[2개 항목]`이라는 텍스트가 표시되는지 확인합니다.
9. `변경 사항 저장` 버튼을 클릭합니다.
# 판매 데이터 집합 추가하기
다음으로 `판매` 데이터 집합을 추가하겠습니다. 이런 방식으로 보고서에서 시각화할 실제 데이터가 제공됩니다.
1. `데이터` 패널에서 `Contoso` 데이터 소스 옆의 `+` 아이콘을 클릭합니다.
2. `데이터 집합 편집기` 대화 상자에서 다음을 수행합니다.
* `이름` 필드에 `Sales` 입력
* `Uri/Path` 필드에 `/FactSales` 입력
* `Json 경로` 필드에 `$.value.*` 입력
기본적으로 각 `Sales` 레코드에는 19개의 필드가 포함되어 있지만 모두 필요하지는 않습니다. 쿼리 매개 변수를 통해 OData `$select` 쿼리 옵션을 적용하여 검색되는 필드를 제한합니다.
3. `매개 변수` 섹션 오른쪽에 있는 `+` 아이콘을 클릭합니다.
4. 새 매개 변수 항목에 대해 다음을 수행합니다.
* `매개 변수` 필드에서 `$select`를 선택합니다.
* `값` 필드에 `DateKey,StoreKey,SalesAmount,ChannelKey,ProductKey,SalesQuantity,PromotionKey`를 입력합니다.
`유효성 검사` 버튼을 클릭하고 `데이터베이스 필드` 섹션에 `[7개 항목]`이라는 텍스트가 표시되는지 확인한 다음 변경 사항 저장 버튼을 클릭합니다.
보고서 디자인 절차를 간소화하기 위해 몇 개의 계산된 필드를 추가할 것입니다. 이 값들은 데이터 집합에서 반환한 필드로부터 유도됩니다.
5. `계산 필드` 섹션 오른쪽에 있는 `+` 아이콘을 클릭합니다.
6. 새 계산된 필드에서 다음을 수행합니다.
* `필드 이름` 필드에 *SalesYear*를 입력합니다.
* `값` 필드에 \*{Year(DateKey)}\*를 입력합니다.
이 표현식은 [Year 함수](https://demo.mescius.co.kr/activereportsjs/docs/ReportAuthorGuide/Expressions/Functions/date-time#%EB%85%84)를 사용하여 판매 날짜의 해를 반환합니다.
이 절차를 반복하여 다음 계산된 필드를 추가합니다.
7. *SalesMonth*와 `값` *{Month(DateKey)}*
8. *SalesChannel*과 `값` *{Switch(ChannelKey = 1, "Store", ChannelKey = 2, "Online", ChannelKey = 3, "Catalog", ChannelKey = 4, "Reseller")}*
9. *ProductCategory*와 `값` *{Switch(ProductKey < 116, "Audio", ProductKey >= 116 And ProductKey < 338, "TV and Video", ProductKey >= 338 And ProductKey < 944, "Computers", ProductKey >= 944 And ProductKey < 1316, "Cameras", ProductKey >= 1316, "Cell Phones")}*
10. 마지막으로 `변경 사항 저장` 버튼을 클릭합니다.
마지막 두 개의 표현식은 [Switch 함수](https://demo.mescius.co.kr/activereportsjs/docs/ReportAuthorGuide/Expressions/Functions/program-flow#Switch)를 사용하여 채널 ID(ChannelKey)와 제품 ID별 제품 범주(ProductKey)로 채널 이름을 결정합니다.
# 보고서 매개 변수 추가하기
이 판매 보고서는 판매 연도별 판매 데이터를 필터링하는 기능을 사용자에게 제공합니다. 이를 위해 보고서 매개 변수를 사용합니다. `연도` 보고서 매개 변수를 생성하려면 아래 단계를 따릅니다.
1. `데이터` 패널로 이동하여 `매개 변수` 섹션의 `+추가` 버튼을 클릭합니다.
2. `이름` 필드에서 `연도`를 입력합니다.
3. `데이터 유형` 드롭다운에서 `정수`를 선택합니다.
4. `숨김` 플래그를 `True`로 설정합니다.
5. `기본값` 섹션에서 다음을 수행합니다.
* `쿼리 사용 안함` 옵션 선택
* `추가` 버튼 클릭
* 기본값을 `2007`로 설정
# 필터 패널 추가하기
보고서 구독자가 `연도` 매개 변수 값을 설정하도록 지원하기 위해 `Sales` 데이터 집합에서 모든 연도를 표시하는 대화형 패널을 사용할 것입니다. 먼저 섹션 영역 안을 클릭하고 `높이` 속성을 `10in`로 설정한 뒤 다음 단계를 따릅니다.
1. **도구 상자 액세스:** 도구 모음 왼쪽에 있는 `햄버거` 메뉴를 사용하여 도구 상자를 확장합니다.
2. **컨테이너 추가:** [컨테이너 보고서 항목](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Supplemental-Report-Items/Container)을 도구 상자에서 섹션의 왼쪽 상단 구석으로 끌어 놓습니다.
3. **컨테이너 구성:** 속성 검사자에서 [속성 패널](/activereportsjs/docs/ReportAuthorGuide/Report-Designer-Interface)로 전환하고 컨테이너에 대해 다음 속성을 설정합니다.
| Property | Value |
| -------- | ----- |
| Name | `FilterPanel` |
| Border Width | `0.25pt` |
| Border Style | `Solid` |
| Border Color | `Gainsboro` |
| Left | `0.5in` |
| Top | `0.5in` |
| Width | `9in` |
| Height | `1in` |
4. **텍스트 상자 추가:** 도구 상자로부터 [텍스트 상자 보고서 항목](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Visualizers/TextBox)을 새로 추가된 컨테이너의 왼쪽 상단 구석으로 끌어 놓습니다. 텍스트 상자를 다음 속성으로 구성합니다.
| Property | Value |
| -------- | ----- |
| Name | `FilterPanelHeader` |
| Value | `Click year to filter data` |
| Font Weight | `Bold` |
| Text Align | `Center` |
| Vertical Align | `Middle` |
| Left | `0.25in` |
| Top | `0.25in` |
| Width | `2.25in` |
| Height | `0.5in` |
5. **목록 추가:** [목록 보고서 항목](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/List)을 도구 상자에서 컨테이너 영역으로 끌어 놓습니다. 목록을 다음 속성으로 구성합니다.
| Property | Value |
| -------- | ----- |
| Name | `YearList` |
| Action Type | `Apply Parameters` |
| Apply Parameters Configuration | Parameter: `Year`, Action: `Set`, Value: `{SalesYear}` |
| Data Set Name | `Sales` |
| Group Expression | `{SalesYear}` |
| Text Align | `Center` |
| Vertical Align | `Middle` |
| Left | `2.75in` |
| Top | `0in` |
| Width | `6in` |
| Height | `1in` |
| Rows or Columns Count | `3` |
6. **목록에 텍스트 상자 추가:** `텍스트 상자` 항목을 도구 상자에서 목록의 왼쪽 상단 구석으로 끌어 놓습니다. 텍스트 상자를 다음 속성으로 구성합니다.
| Property | Value |
| -------- | ----- |
| Name | `YearText` |
| Value | `{SalesYear}` |
| Default Border Width | `0.5pt` |
| Default Border Style | `{IIF(SalesYear = @Year, "Dashed", "None")}` |
| Default Border Color | `Black` |
| Text Align | `Center` |
| Vertical Align | `Middle` |
| Left | `0.5in` |
| Top | `0.5in` |
| Width | `9in` |
| Height | `1in` |
이러한 여러 단계를 성공적으로 완료하면 보고서 디자인이 아래와 같이 나타나게 됩니다.
보고서를 미리 보면 2007, 2008, 2009 연도가 가로 형식으로 표시되는 것을 볼 수 있습니다. 현재 매개 변수 값과 일치하는 연도가 테두리로 강조 표시됩니다. 원하는 연도를 클릭하여 매개 변수 값을 조절할 수 있습니다.
# 요약 표 추가하기
다음으로 현재 선택된 연도의 월간 매출을 표시하는 표를 추가하겠습니다.
1. **디자인 타임으로 전환**: UI 왼쪽 상단 구석에 있는 `뒤로` 버튼을 클릭하여 보고서 디자인으로 돌아갑니다.
2. **도구 상자 액세스:** 도구 모음 왼쪽에 있는 `햄버거` 메뉴를 클릭하여 도구 상자를 확장합니다.
3. **표 추가**: 도구 상자에서 [표 보고서 항목](/activereportsjs/docs/v6.1/)을 이전 단계에서 추가된 필터 패널 아래의 섹션 영역으로 끌어 놓습니다. 표에서 다음 속성을 설정합니다.
| Property | Value |
| -------- | ----- |
| Name | `SummaryTable` |
| Border Width | `0.25pt` |
| Border Style | `Solid` |
| Border Color | `Gainsboro` |
| Left | `0.5in` |
| Top | `1.75in` |
| Data Set Name | `Sales` |
4. **표 필터 구성**: 표 속성에서 `필터` 속성을 찾고 `추가` 버튼을 클릭합니다. 필터 편집기에서 `추가...` 버튼을 클릭하고 `SalesYear` 필드를 선택한 다음 `=` 연산자 오른쪽의 드롭다운 목록에서 `연도` 매개 변수를 선택합니다.
5. **표 그룹화 구성**: 표의 그룹 에디터에서 `SummaryTable_DetailsGroup1` 항목을 클릭합니다. `{SalesMonth}`를 `GroupingExpressions` 및 `SortExpressions` 목록에 추가합니다. 이 구성은 월별로 하나의 세부 정보 행을 생성하고 오름차순으로 정렬합니다.
6. **표 열 구성**: 표 세 번째 열의 [열 처리기](/activereportsjs/docs/v6.1/#table-designer)를 우클릭하고 드롭다운 메뉴에서 `삭제` 명령을 선택합니다. 해당 열 처리기를 클릭하고 속성 검사자에서 속성을 수정하여 첫 번째 열의 너비를 `2.5in`로 설정하고 두 번째 열의 너비를 `1.5in`로 설정합니다.
7. **표 셀 구성**: 표의 각 셀은 표 셀을 클릭하여 선택할 수 있는 텍스트 상자 보고서 항목을 포함합니다. 아래 표를 사용하여 이 텍스트 상자의 속성을 설정합니다.
| Row | Column | Property | Value |
| --- | ------ | -------- | ----- |
| 1st | 1st | Name | `SummaryTableHeader` |
| | | Value | `Monthly sales in {@Year}` |
| 2nd | 1st | Name | `SalesMonth` |
| | | Value | `{MonthName(SalesMonth)}` |
| 2nd | 2nd | Name | `SalesAmount` |
| | | Value | `{SalesAmount}` |
| | | Format | `c2` |
| 3rd | 1st | Name | `TextTotal` |
| | | Value | `Total` |
| | | Font Weight | `Bold` |
| | | Text Align | `Right` |
| 3rd | 2nd | Name | `SalesAmountTotal` |
| | | Value | `{Sum(SalesAmount)}` |
| | | Format | `c2` |
| | | Font Weight | `Bold` |
이러한 여러 단계를 성공적으로 완료하면 보고서 디자인이 아래와 같이 나타나게 됩니다.
이제 보고서를 미리 보고 필터 패널에서 연도를 전환할 수 있습니다. 표는 다시 렌더링되어 현재 선택된 연도 데이터를 표시하게 됩니다.
# 차트에 추가하기
이 섹션에서는 현재 선택된 연도의 판매 채널당 판매량을 나타내는 차트를 추가할 것입니다. 단계는 다음과 같습니다.
1. **디자인 타임으로 전환**: UI 왼쪽 상단 구석에 있는 `뒤로` 버튼을 클릭하여 보고서 디자인 보기로 돌아갑니다.
2. **도구 상자 액세스:** 도구 모음 왼쪽에 있는 `햄버거` 메뉴를 클릭하여 도구 상자를 확장합니다.
3. **차트 추가**: 도구 상자에서 [차트 보고서 항목](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Chart)을 이전 단계에서 추가된 표 옆 섹션 영역으로 끌어 놓습니다. 그러면 [차트 마법사](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Chart)가 나타납니다.
4. **차트 데이터 구성**: 차트 마법사의 `데이터 및 유형` 섹션에서 `데이터 집합 선택` 드롭다운 메뉴의 `판매`를 선택하고 `막대` 도표 유형을 선택합니다.
그 후 `다음`을 클릭합니다. `막대 설정` 페이지에서 `데이터 값`을 추가하여 `필드`를 `{SalesAmount}`로 설정하고 `집계`를 `합계`로 설정합니다. `데이터 범주`에서 필드를 `{SalesChannel}`로 설정하고 `다음`을 클릭합니다.
`미리 보기` 페이지에서 `차트 팔레트 선택` 드롭다운의 `회색조`를 선택하고 `마침`을 클릭합니다.
5. **보고서 탐색기 열기**: `햄버거` 메뉴 아래의 `탐색기` 버튼을 클릭하고 보고서 탐색기를 고정하여 계속 표시되게 함으로써 차트 영역 내 탐색을 촉진합니다.
6. **일반 차트 속성 설정**: `보고서 탐색기`에서 `Chart1` 항목을 선택합니다. 그런 다음 속성 패널에서 다음 속성을 설정합니다.
| Property | Value |
| -------- | ----- |
| Name | `ChartSalesPerChannel` |
| Border Width | `0.25pt` |
| Border Style | `Solid` |
| Border Color | `Gainsboro` |
| Left | `5in` |
| Top | `1.75in` |
| Width | `4.5in` |
| Height | `3.5in` |
7. **차트 필터 구성**: 차트 속성에서 `필터` 속성을 찾고 `추가` 버튼을 클릭합니다. 필터 편집기에서 `추가...` 버튼을 클릭하고 `SalesYear` 필드를 선택한 다음 `=` 연산자 오른쪽의 드롭다운 목록에서 `연도` 매개 변수를 선택합니다.
8. **차트 헤더 구성**: `보고서 탐색기`에서 `ChartSalesPerChannel` 아래의 `헤더`를 선택하고 다음 속성을 설정합니다.
| Property | Value |
| -------- | ----- |
| Caption | `Sales per Channel in {@Year}` |
| Text Align | `Left` |
| Vertical Align | `Top` |
| Padding | `2pt` |
9. **X축 구성**: `보고서 탐색기`의 `도표 영역` 아래에서 `X축 - [Plot1]`을 선택하고 `선` 섹션의 `표시 여부` 플래그를 `False`로 설정합니다.
10. **Y축 구성**: `보고서 탐색기`에서 `도표 영역` 아래의 `Y축 - [Plot1]` 항목을 클릭하고 다음 속성을 설정합니다.
| Property | Value |
| -------- | ----- |
| Title | ` ` (empty string) |
| Line->Visible | `False` |
| Labels->Visible | `False` |
| Major Grid->Visible | `False` |
11. **도표 구성**: `보고서 탐색기`의 `ChartSalesPerChannel` 아래에서 `도표 - Plot1` 항목을 선택하고 다음 설정을 적용합니다.
| Property | Value |
| -------- | ----- |
| Category Sort Expression | `{Sales Amount}` |
| Category Sort Direction | `Ascending` |
| Category Sorting Aggregate | `Sum` |
| Label Text->Template | `{valueField.value:c2}` (this can be set in the expression editor) |
이러한 여러 단계를 성공적으로 완료하면 보고서 디자인이 아래와 같이 나타나게 됩니다.
이러한 단계를 거친 뒤 보고서를 미리 보고 필터 패널을 사용하여 연도를 전환할 수 있습니다. 차트와 표 모두 현재 선택된 연도 데이터를 표시하도록 동적으로 업데이트됩니다!
# 세부 정보 표 추가하기
다음으로 현대 선택된 연도 내에서 각 판매의 세부 정보를 표시하는 표를 추가하겠습니다. 많은 개별 판매 기록이 있을 수 있으므로 표를 스크롤할 수 있어야 하며 열 헤더가 고정되어야 합니다.
1. **디자인 타임으로 전환**: UI 왼쪽 상단 구석에 있는 `뒤로` 버튼을 클릭하여 보고서 디자인으로 돌아갑니다.
2. **도구 상자 액세스:** 도구 모음 왼쪽에 있는 `햄버거` 메뉴를 클릭하여 도구 상자를 확장합니다.
3. **컨테이너 추가:** [컨테이너 보고서 항목](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Supplemental-Report-Items/Container)을 도구 상자에서 요약 표 아래의 섹션 영역으로 끌어 놓습니다.
4. **컨테이너 구성:** 속성 검사자를 사용하여 컨테이너에 대해 다음 속성을 설정합니다.
| Property | Value |
| -------- | ----- |
| Name | `DetailsTableContainer` |
| Border Width | `0.25pt` |
| Border Style | `Solid` |
| Border Color | `Gainsboro` |
| Left | `0.5in` |
| Top | `5.5in` |
| Width | `9in` |
| Height | `4in` |
| Can Grow | `False` |
| Overflow | `Auto` |
5. **표 추가**: 도구 상자로부터 [표 보고서 항목](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Table)을 새로 추가된 컨테이너의 왼쪽 상단 구석으로 끌어 놓습니다. 표에서 다음 속성을 설정합니다.
| Property | Value |
| -------- | ----- |
| Name | `SummaryTable` |
| Left | `0in` |
| Top | `0in` |
| Data Set Name | `Sales` |
| Frozen Rows | `1` |
6. **표 필터 구성**: 표 속성에서 `필터` 속성을 찾고 `추가` 버튼을 클릭합니다. 필터 편집기에서 `추가...` 버튼을 클릭하고 `SalesYear` 필드를 선택한 다음 `=` 연산자 오른쪽의 드롭다운 목록에서 `연도` 매개 변수를 선택합니다. 요약 표 및 차트에 추가된 것과 동일한 필터입니다.
7. **표 열 구성**: 표 세 번째 열의 [열 처리기](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Table)를 우클릭하고 드롭다운 메뉴에서 `열->삽입->더 보기...` 명령을 선택합니다. `열 삽입` 대화창에서 `개수`를 `3`으로 설정하고 위치를 `오른쪽`으로 설정한 다음 `삽입` 버튼을 클릭합니다. 열 처리기를 클릭하고 `너비` 속성을 속성 검사자에서 수정하여 다음 열 너비를 설정합니다.
| Column | Width |
| ------ | ----- |
| 1st | `1in` |
| 2nd | `1.5in` |
| 3rd | `1.75in` |
| 4th – 6th | `1.5in` |
8. **표 셀 구성**: 표의 각 셀은 표 셀을 클릭하여 선택할 수 있는 텍스트 상자 보고서 항목을 포함합니다. 아래 표를 사용하여 이 텍스트 상자의 속성을 설정합니다.
| Row | Column | Property | Value |
| --- | ------ | -------- | ----- |
| 1st | 1st | Name | `DateHeader` |
| | | Value | `Date` |
| 2nd | 1st | Name | `DateValue` |
| | | Value | `{DateKey}` |
| | | Text Align | `Left` |
| 1st | 2nd | Name | `SalesChannelHeader` |
| | | Value | `Sales Channel` |
| 2nd | 2nd | Name | `SalesChannelValue` |
| | | Value | `{SalesChannel}` |
| 1st | 3rd | Name | `ProductCategoryHeader` |
| | | Value | `Product Category` |
| 2nd | 3rd | Name | `ProductCategoryValue` |
| | | Value | `{ProductCategory}` |
| 1st | 4th | Name | `DiscountTypeHeader` |
| | | Value | `Discount Type` |
| 2nd | 4th | Name | `DiscountTypeValue` |
| | | Value | `{Lookup(PromotionKey, PromotionKey, PromotionType, "Promotions")}` |
| 1st | 5th | Name | `SalesQuantityHeader` |
| | | Value | `Sales Quantity` |
| | | Text Align | `Right` |
| 2nd | 5th | Name | `SalesQuantityValue` |
| | | Value | `{SalesQuantity}` |
| 1st | 6th | Name | `SalesAmountHeader` |
| | | Value | `Sales Amount` |
| | | Text Align | `Right` |
| 2nd | 6th | Name | `SalesAmountValue` |
| | | Value | `{SalesAmount}` |
| | | Format | `c2` |
9. **표 행 구성**: 첫 번째 행의 처리기를 클릭하고 속성 검사자의 `TextBox` 탭으로 전환합니다. 이렇게 하면 선택된 행에 있는 모든 텍스트 상자의 속성을 동시에 설정할 수 있습니다.
| Property | Value |
| -------- | ----- |
| Background Color | `White` |
| Border Width | `0.5pt` |
| Bottom Border Style | `Solid` |
| Border Color | `Black` |
이러한 단계를 성공적으로 완료하면 보고서 디자인이 다음과 같이 나타나게 됩니다.
이제 보고서를 미리 보고, 서로 다른 연도를 토글하고, 요약 표, 차트, 세부 정보 표의 판매 통계를 자세히 살펴볼 수 있습니다. 이러한 요소는 선택된 연도에 해당하는 데이터를 반영하도록 동적으로 업데이트됩니다.