# 보고서 디자이너 인터페이스 ## 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/v6.2/ReportAuthorGuide/Report-Items/Data-Regions/Tablix) 구조를 탐색하거나 테이블릭스 멤버를 추가 또는 제거하여 구조를 빠르게 수정할 수 있습니다. 그룹 탐색기를 열려면 디자이너 왼쪽 위에 있는 [보고서 탐색기 열기](/activereportsjs/docs/v6.2/#report-explorer) 버튼 아래 있는 트리 아이콘을 클릭합니다. 해당하는 버튼을 사용하여 보고서 편집기를 고정해 항상 열려 있도록 할 수도 있습니다. 그룹 편집기 사용에 대한 자세한 내용은 [테이블릭스 문서](/activereportsjs/docs/v6.2/ReportAuthorGuide/Report-Items/Data-Regions/Tablix#insert-adjacent-child-or-parent-groups)를 참조하십시오. ## 보고서 레이어 편집기 `보고서 레이어` 편집기를 사용하여 `보고서 레이어`를 추가하거나 제거하고 해당 속성을 수정할 수 있습니다. 자세한 내용은 [보고서 레이어](/activereportsjs/docs/v6.2/ReportAuthorGuide/보고서-레이어) 페이지를 방문하세요. ## 도구 모음 보고서 디자이너 상단에 위치한 `도구 모음`을 사용하여 보고서 항목을 `잘라내기`, `복사`, `붙여넣기`, `삭제`할 수 있으며, [텍스트 속성](/activereportsjs/docs/v6.2/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/v6.2/ReportAuthorGuide/Report-Items/Common-Properties)을 수정할 수 있습니다. `기본` 모드에서는 필수 속성만 표시되며, `고급 모드`에서는 모든 속성이 표시됩니다. 보고서 디자이너의 오른쪽 아래에 있는 드롭다운 메뉴를 사용하여 `기본`과 `고급` 모드 간에 전환할 수 있습니다. 이 드롭다운 메뉴 왼쪽에는 [길이 단위](/activereportsjs/docs/v6.2/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/v6.2/ReportAuthorGuide/Databinding)을 구성할 수 있습니다. * [보고서 매개 변수](/activereportsjs/docs/v6.2/ReportAuthorGuide/Report-Parameters)를 추가, 제거하고 순서를 다시 정렬하는 데 사용할 수 있습니다. * 보고서로 끌어 놓을 수 있는 [전역 값](/activereportsjs/docs/v6.2/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 ### Explore 기능 보고서에 대한 [데이터 바인딩](https://docapp.mescius.io/manage/ArticleEdit//activereportsjs/docs/v6.2/)을 구성한 후, `Explore` 기능을 사용하면 데이터 집합에 대한 데이터 시각화를 빠르게 생성할 수 있습니다. 1. 데이터 세트 이름 옆에 있는 `Explore` 아이콘을 클릭하면 해당 데이터 집합의 모든 필드로부터 시각화를 생성할 수 있습니다: ![Explore function](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8353768a-828a-4639-8762-a10142acfb34/Designer-Interface-1-20260916.ffd83e.png) 또는 필드의 일부만 시각화하려면 데이터 집합 이름 옆에 있는 `Expand` 버튼을 클릭한 다음, 그 자리에 나타나는 `Select Fields...` 버튼을 클릭하고 시각화할 필드를 선택한 후 `Explore` 버튼을 클릭하세요. ![Explore function](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8353768a-828a-4639-8762-a10142acfb34/Designer-Interface-2-20260916.066f61.png) 2. 다음 단계는 리포트 디자이너에 AI 지원 기능이 구성되어 있는지 여부에 따라 달라집니다 — [독립 실행형 보고서 디자이너](/activereportsjs/docs/v6.2/ReportAuthorGuide/QuickStart/Get-Started-With-Designer-App#ai-지원-기능-구성)를 사용하는 경우에는 `ai-config.json` 파일을 통해, 보고서 디자이너가 사용자의 애플리케이션에 내장된 경우에는 [호스팅 애플리케이션이 활성화한](/activereportsjs/docs/v6.2/DeveloperGuide/고급-api/---------------ai----------) AI 리포팅 기능을 통해 구성됩니다. **AI 지원 기능이 구성되지 않은 경우:** 디자이너는 내장된 `Instant Visuals`로 대체됩니다. 이 기능은 정적 알고리즘으로 데이터 집합의 필드 이름과 유형을 분석하여 차트, 테이블, 피벗 테이블 시각화를 즉시 제안합니다. **AI 지원 기능이 구성된 경우:** 디자이너는 데이터 집합의 필드 이름과 유형만(실제 데이터 값은 절대 전송하지 않음) 구성된 AI 제공업체로 전송하며, 시각화가 생성되는 동안 취소 가능한 진행 상황 패널을 표시합니다: ![Explore function](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8353768a-828a-4639-8762-a10142acfb34/Designer-Interface-3-20260916.b0b9a8.png) AI 제공업체로의 요청이 실패할 경우, 예를 들어 연결 문제나 구성 문제로 인해 실패하면, 디자이너는 재시도할지 아니면 `Instant Visuals`로 대체할지 묻습니다: ![Explore function](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8353768a-828a-4639-8762-a10142acfb34/Designer-Interface-4-20260916.5e2c93.png) 3. 시각화가 준비되면 — AI로 생성되었든 `Instant Visuals`로 생성되었든 — 각각의 표시 내용을 간단히 설명한 카드 형태로 표시됩니다. 아래 예시에서는 패널이 매출 데이터를 요약한 태블릭스 2개와 막대 차트 1개를 제공합니다: ![Explore function](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8353768a-828a-4639-8762-a10142acfb34/Designer-Interface-5-20260916.cd3e47.png) 4. 각 카드마다 오른쪽 하단의 드롭다운 메뉴를 사용해 색상 테마를 선택할 수 있습니다. 카드를 클릭하거나 보고서 레이아웃으로 드래그 앤 드롭하여 시각화를 보고서에 추가하세요. ## 식 편집기 `식 편집기`는 [표현식](/activereportsjs/docs/v6.2/ReportAuthorGuide/Report-Items/Common-Properties#expression)을 쉽게 작성할 수 있는 대화 상자입니다. 식 기반 속성 편집기의 오른쪽 경계에서 상자를 클릭하면 나타나는 드롭다운 메뉴를 사용하여 열 수 있습니다. `표현식 편집기` 왼쪽에는 사용 가능한 상수, 함수 및 참조가 열거됩니다. 자세한 내용은 [표현식 문서](/activereportsjs/docs/v6.2/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/v6.2/ReportAuthorGuide/Report-Items/Data-Regions) 또는 데이터 영역 일부(예: [표 그룹](/activereportsjs/docs/v6.2/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