# 보고서 디자이너 인터페이스 ## Content 보고서 디자이너를 사용하면 보고서 템플릿을 만들고 수정할 수 있습니다. 보고서 디자이너 인터페이스는 아래에서 설명하는 여러 컴포넌트로 구성되어 있습니다. ## 도구 상자 `도구 상자`는 사용 가능한 보고서 항목을 열거합니다. 기본적으로 도구 상자에는 아이콘이 표시되지만 디자이너 왼쪽 위에 있는 `햄버거` 메뉴를 사용하여 확장해 보고서 항목 이름을 볼 수 있습니다. 보고서에 보고서 항목을 추가하려면 도구 상자에서 해당 항목을 두 번 클릭하거나 보고서 항목을 특정 보고서 영역으로 끌어 놓습니다. DOC-DETAILS-TAG-OPEN DOC-SUMMARY-TAG-OPEN 확장하여 실행 중인 보고서 항목 추가 보기 DOC-SUMMARY-TAG-CLOSE ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/4ed8c11f-8d09-4226-9c37-dd4595797443/reportauthor-guide/Tablix/AddingTablix.gif) DOC-DETAILS-TAG-CLOSE ## 보고서 탐색기 `보고서 탐색기`를 사용하면 보고서 구조를 탐색하고 보고서 항목 및 또는 보고서의 일부분을 신속하게 선택할 수 있습니다. 보고서 탐색기를 열려면 디자이너 왼쪽 위에 있는 `도구상자 열기` 버튼 아래 있는 `트리` 아이콘을 클릭합니다. 해당하는 버튼을 사용하여 보고서 탐색기를 고정해 항상 열려 있도록 할 수도 있습니다. 보고서 계층 구조에서 항목을 클릭하여 선택합니다. DOC-DETAILS-TAG-OPEN DOC-SUMMARY-TAG-OPEN 확장하여 실행 중인 보고서 탐색기 사용 보기 DOC-SUMMARY-TAG-CLOSE ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/4ed8c11f-8d09-4226-9c37-dd4595797443/reportauthor-guide/Chart/ChartAddingAndConfiguring.gif) DOC-DETAILS-TAG-CLOSE ## 그룹 편집기 `그룹 편집기`는 [테이블릭스](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Tablix) 구조를 탐색하거나 테이블릭스 멤버를 추가 또는 제거하여 구조를 빠르게 수정할 수 있습니다. 그룹 탐색기를 열려면 디자이너 왼쪽 위에 있는 [보고서 탐색기 열기](/activereportsjs/docs/v6.1/#report-explorer) 버튼 아래 있는 트리 아이콘을 클릭합니다. 해당하는 버튼을 사용하여 보고서 편집기를 고정해 항상 열려 있도록 할 수도 있습니다. 그룹 편집기 사용에 대한 자세한 내용은 [테이블릭스 문서](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Tablix#insert-adjacent-child-or-parent-groups)를 참조하십시오. ## 보고서 레이어 편집기 `보고서 레이어` 편집기를 사용하여 `보고서 레이어`를 추가하거나 제거하고 해당 속성을 수정할 수 있습니다. 자세한 내용은 [보고서 레이어](/activereportsjs/docs/ReportAuthorGuide/보고서-레이어) 페이지를 방문하세요. ## 도구 모음 보고서 디자이너 상단에 위치한 `도구 모음`을 사용하여 보고서 항목을 `잘라내기`, `복사`, `붙여넣기`, `삭제`할 수 있으며, [텍스트 속성](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Common-Properties)을 구성할 수도 있습니다. DOC-SUMMARY-TAG-OPEN 확장하여 실행 중인 도구 모음 사용 보기 DOC-SUMMARY-TAG-CLOSE ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/4ed8c11f-8d09-4226-9c37-dd4595797443/reportauthor-guide/UsingToolbar.gif) DOC-DETAILS-TAG-CLOSE ## 보고서 레이아웃 `보고서 레이아웃`은 보고서 항목을 표시하고 선택 및 다시 정렬하도록 하는 페이지 형태의 시각적 화면입니다. 보고서 디자이너의 오른쪽 아래에 있는 UI 요소를 사용하여 페이지 화면의 다양한 디자인 타임 속성을 구성할 수 있습니다. * `눈금` 버튼을 사용하여 눈금을 표시하거나 숨깁니다. * `축소`, `확대` 또는 `확대/축소 수준` 버튼을 사용하여 확대/축소 수준을 설정합니다. * 자석처럼 생긴 아이콘의 드롭다운 메뉴를 사용하여 `눈금 크기`를 설정하고 다음 옵션을 구성합니다. * `눈금에 맞춤` \- 활성화되어 있으면 보고서 항목의 위치와 크기가 눈금에 맞춰 정렬됩니다\. * `안내선에 맞춤` \- 활성화되어 있으면 보고서 디자이너에 안내선이 표시되어 보고서 항목의 크기 및 위치를 다른 보고서 항목과 쉽게 맞출 수 있습니다\. ## 속성 검사자 `속성 검사자`는 보고서 디자이너의 오른쪽에 있으며 `속성 패널`과 `데이터 패널`, 이렇게 두 가지 컴포넌트로 구성되어 있습니다. ## 속성 패널 `속성 패널`은 기본적으로 열려 있으며 여기서 [보고서 항목 속성](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Common-Properties)을 수정할 수 있습니다. `기본` 모드에서는 필수 속성만 표시되며, `고급 모드`에서는 모든 속성이 표시됩니다. 보고서 디자이너의 오른쪽 아래에 있는 드롭다운 메뉴를 사용하여 `기본`과 `고급` 모드 간에 전환할 수 있습니다. 이 드롭다운 메뉴 왼쪽에는 [길이 단위](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Common-Properties#length)에 대한 기본 측정 단위를 설정하는 스위치가 있습니다. DOC-DETAILS-TAG-OPEN DOC-SUMMARY-TAG-OPEN 확장하여 실행 중인 기본 모드 및 고급 모드 사용 보기 DOC-SUMMARY-TAG-CLOSE ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/4ed8c11f-8d09-4226-9c37-dd4595797443/reportauthor-guide/PropertiesPanel.gif) DOC-DETAILS-TAG-CLOSE ## 데이터 패널 `데이터 패널`은 여러 기능을 요약합니다. * 이 패널에서는 [데이터 바인딩](/activereportsjs/docs/ReportAuthorGuide/Databinding)을 구성할 수 있습니다. * [보고서 매개 변수](/activereportsjs/docs/ReportAuthorGuide/Report-Parameters)를 추가, 제거하고 순서를 다시 정렬하는 데 사용할 수 있습니다. * 보고서로 끌어 놓을 수 있는 [전역 값](/activereportsjs/docs/ReportAuthorGuide/Expressions/references#global-values) 목록을 표시합니다. DOC-DETAILS-TAG-OPEN DOC-SUMMARY-TAG-OPEN 확장하여 실행 중인 데이터 패널 사용 보기 DOC-SUMMARY-TAG-CLOSE ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/4ed8c11f-8d09-4226-9c37-dd4595797443/reportauthor-guide/GetStartedWithAnalyticalReport/AddingDataSource.gif) DOC-DETAILS-TAG-CLOSE ### 즉각적인 시각 자료 \| Instant Visual 보고서의 [데이터 바인딩](/activereportsjs/docs/v6.1/)을 구성한 후, `즉각적인 시각 자료` 기능을 활용하여 선택한 데이터 집합에 대한 데이터 시각 자료를 빠르게 생성할 수 있습니다: 1. 데이터 집합 이름 옆에 있는 `확장` 버튼을 클릭하여 데이터 세트를 확장합니다: ![image.ae8ab4](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8c2d4ff8-f06d-401b-929d-fc20f30cdb0d/image.ae8ab4.b0110e.png) 2. `확장` 버튼을 대신하여 나타나는 `필드 선택...` 버튼을 클릭합니다: ![image.4bd535](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8c2d4ff8-f06d-401b-929d-fc20f30cdb0d/image.4bd535.143911.png) 3. 시각화할 필드를 선택한 다음, 필드를 선택하면 나타나는 `탐색` 버튼을 클릭합니다. 아래 예시에서는 `freight`와 `shipCountry` 두 필드를 선택했습니다: ![image.c7a492](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8c2d4ff8-f06d-401b-929d-fc20f30cdb0d/image.c7a492.209e45.png) 4. `즉각적인 시각 자료` 패널이 열리며, 차트, 테이블, 피벗 테이블과 같은 여러 가지 사전 구축된 시각 자료를 제공합니다. 원하는 시각 자료를 보고서에 드래그 앤 드롭할 수 있으며, 각 시각화 오른쪽 하단에 위치한 팔레트 아이콘을 통해 색상 테마를 선택하여 시각 자료의 외형을 커스터마이징할 수 있습니다. 아래 예시에서는 `막대 차트`, `원형 차트`, 그리고 운송 국가별 운송비를 요약한 `테이블`을 제공합니다: ![image.cd540e](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8c2d4ff8-f06d-401b-929d-fc20f30cdb0d/image.cd540e.1c0dbf.png) ## 식 편집기 `식 편집기`는 [표현식](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Common-Properties#expression)을 쉽게 작성할 수 있는 대화 상자입니다. 식 기반 속성 편집기의 오른쪽 경계에서 상자를 클릭하면 나타나는 드롭다운 메뉴를 사용하여 열 수 있습니다. `표현식 편집기` 왼쪽에는 사용 가능한 상수, 함수 및 참조가 열거됩니다. 자세한 내용은 [표현식 문서](/activereportsjs/docs/ReportAuthorGuide/Expressions)를 참조하십시오. 항목을 두 번 클릭하면 오른쪽에 표시된 결과 식에 추가됩니다. DOC-DETAILS-TAG-OPEN DOC-SUMMARY-TAG-OPEN 확장하여 실행 중인 표현식 편집기 사용 보기 DOC-SUMMARY-TAG-CLOSE ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/4ed8c11f-8d09-4226-9c37-dd4595797443/reportauthor-guide/UsingExpressionEditor.gif) DOC-DETAILS-TAG-CLOSE ## 필터 편집기 `필터 편집기`는 [데이터 영역](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions) 또는 데이터 영역 일부(예: [표 그룹](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Table#table-grouping))에 표시되는 데이터를 제외할 조건을 쉽게 구성할 수 있는 인터페이스입니다. `필터` 속성의 편집기를 클릭하면 `필터 편집기`가 열리는데, 아직 추가된 필터가 없으면 `추가...` 텍스트가 표시되고 그렇지 않으면 `편집...` 텍스트가 표시됩니다. DOC-DETAILS-TAG-OPEN DOC-SUMMARY-TAG-OPEN 확장하여 실행 중인 필터 편집기 사용 보기 DOC-SUMMARY-TAG-CLOSE ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/4ed8c11f-8d09-4226-9c37-dd4595797443/reportauthor-guide/GetStartedWithTabularReport/AddingFilters.gif) DOC-DETAILS-TAG-CLOSE