# 세로 막대형 및 가로 막대형 도표 만들기 (표준, 극좌표형, 나선형)

## Content

## 소개

`세로 막대형`, `가로 막대형`, `극좌표형`, `나선형` 도표를 구성하기 전에, 보고서에 차트를 추가했는지 확인하세요. 차트를 추가하고 `차트 마법사`를 실행하는 방법은 [차트 추가하기](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Chart)를 참조하세요.`차트 마법사`가 열리면 **가로 막대형, 세로 막대형, 범위 가로 막대형, 범위 세로 막대형, 극좌표형 또는 나선형 도표 유형을 선택**하고, 시각화할 데이터 집합을 선택한 다음 **다음 페이지**로 진행합니다.

## 도표 설정

`세로 막대형`, `가로 막대형`, `극좌표형`, `나선형` 도표 유형에 대한 `차트 마법사`의 `설정` 페이지는 다음과 같습니다:
![image](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/e246fd18-2fe0-40c8-92dc-c49712028485/image.8aa398.png)

이 페이지는 세 개의 섹션으로 나뉩니다:

### 데이터 계열

**필드** [컬렉션](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Common-Properties)은 시각화할 **데이터 값** 을 정의합니다. 이 값들은 다음과 같은 시각적 속성을 결정합니다:

* `세로 막대형` 도표의 **열 높이**
* `가로 막대형` 도표의 **막대 길이**
* `극좌표형` 도표의 **섹터 길이(반지름 방향 확장)**
* `나선형` 도표의 **나선을 따라 그려지는 호의 길이**

일반적으로 각 값은 `{Sum(SalesAmount)}`와 같은 [집계 표현식](/activereportsjs/docs/ReportAuthorGuide/Expressions/Functions/aggregates)입니다. 여러 데이터 값을 추가하면 [묶은 세로 막대형 데모](https://demo.mescius.co.kr/activereportsjs/demos/Reports/ClusteredColumnPlot/purejs)에서 볼 수 있듯이 **군집형 도표**가 생성됩니다.

가독성을 높이기 위해 [색상 범례](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Chart/legend)의 **범례 모드** 속성을 `데이터 값`으로 설정할 수 있습니다. 이 옵션은 세로 막대 또는 가로 막대 색상을 데이터 값 이름과 일치시키는 범례를 제공합니다.또한 각 데이터 값 항목의 **캡션** 속성을 사용하여 표시되는 이름을 사용자 정의할 수 있습니다.

**범위 가로 막대형** 및 **범위 세로 막대형** 도표의 경우, 데이터 값은 **하한(Lower)** 및 **상한(Upper)** 값 쌍으로 정의됩니다. 이 도표들은 범위를 필요로 하기 때문입니다. 기본적으로 하나의 값 쌍이 사전 채워진 상태로 제공되며, 필요에 따라 더 많은 쌍을 추가할 수 있습니다. 각 쌍은 도표 요소의 시작 및 종료 위치를 결정합니다.이러한 구성은 범주별 온도 변화나 수익 구간과 같은 범위 데이터를 시각화하는 데 유용합니다.

![image](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/e246fd18-2fe0-40c8-92dc-c49712028485/image.89164d.png)

### 범주 그룹

* **필드:** 데이터를 범주로 그룹화할 필드를 선택하거나 표현식을 지정합니다. 예를 들어, 범주는 월, 지역, 제품 유형 등을 나타낼 수 있습니다. 데이터 값은 각 고유한 범주에 대해 표시됩니다.
* **정렬 방향:** 범주의 정렬 순서를 `오름차순` 또는 `내림차순`으로 지정합니다.

### 계열 그룹

* **필드:** 각 범주 내에서 하위 그룹을 생성할 필드를 선택하거나 표현식을 지정합니다. (예: 제품 유형별로 판매 데이터를 구분)
* **분해 방법:** 하위 그룹을 표시하는 방법을 선택합니다:
    * **클러스터:**
        * `세로 막대형` 및 `가로 막대형` 도표: 각 범주 내에서 하위 그룹을 **나란히** 표시합니다.
        * `극좌표형` 도표: 같은 반지름 축을 따라 하위 그룹을 **서로 인접하게** 배치합니다.
        * `나선형` 도표: 하위 그룹을 **나선을 따라 순차적으로 배치하며, 개별 호를 유지**합니다.
    * **스택:**
        * `세로 막대형` 및 `가로 막대형` 도표: 하위 그룹을 **세로 방향** 또는 **가로 방향** 으로 쌓습니다.
        * `극좌표형` 도표: 하위 그룹을 중심에서 **반지름 방향으로 바깥쪽으로** 쌓습니다.
        * `나선형` 도표: 하위 그룹을 **나선을 따라 순차적으로 쌓으며**, 호를 순서대로 겹쳐 표시합니다.

**데이터 값**, **범주 그룹**, **계열 그룹** 구성을 완료한 후 `다음`을 클릭하여 차트 생성을 마무리하는 [미리 보기 및 최종 조정](/activereportsjs/docs/ReportAuthorGuide/Report-Items/Data-Regions/Chart) 페이지로 이동합니다.