# 그룹화된 데이터 정렬

## Content

SpreadJS는 `groupSort` 열거형(enumeration)을 사용하여 그룹화된 데이터를 다양한 방식으로 정렬할 수 있도록 지원합니다. 이 열거형은 그룹 정렬 방식을 정의하는 네 가지 값을 제공합니다:

| 열거형 값 | 정렬 유형 | 설명 |
| ----- | ----- | --- |
| `none` | Flat Sort (플랫 정렬) | 그룹을 고려하지 않고 데이터를 평면적으로 정렬합니다. |
| `group` | Group Level Sort (그룹 수준 정렬) | 그룹 전체를 정렬하여 이동시키되, 그룹 내부의 데이터는 그대로 유지합니다. |
| `child` | Child Level Sort (자식 수준 정렬) | 그룹 내부의 데이터만 정렬하고 그룹 자체는 유지합니다. |
| `full` | Full Sort (전체 정렬) | 그룹과 그룹 내부의 데이터를 모두 정렬합니다. |

아래 이미지는 예제와 함께 다양한 그룹 정렬 유형을 설명합니다:

| **원본 데이터** | **Flat Sort** | **Group Level Sort** | **Child Level Sort** | **Full Sort** |
| ------ | --------- | ---------------- | ---------------- | --------- |
| ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8d606653-16a0-474d-b9dc-e2b4d01c2446/images/Original_Sort_data.png) | ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8d606653-16a0-474d-b9dc-e2b4d01c2446/images/Flat_Sort.png) | ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8d606653-16a0-474d-b9dc-e2b4d01c2446/images/Group_level.png) | ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8d606653-16a0-474d-b9dc-e2b4d01c2446/images/Child_level.png) | ![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8d606653-16a0-474d-b9dc-e2b4d01c2446/images/Full_sort.png) |

그룹화된 데이터를 포함하는 범위에 정렬을 적용하고 `groupSort` 열거형을 정의하지 않으면, 기본적으로 **그룹 수준 정렬**이 적용됩니다. 또한 정렬 범위 외의 데이터는 위치가 변경되지 않습니다. 예를 들어, 열 A를 정렬하면 열 C의 데이터는 변하지 않습니다.
다음 코드는 API와 UI를 통해 그룹화된 데이터를 정렬하는 방법을 보여줍니다:

```javascript
// 데이터 설정
activeSheet.setArray(3, 0, [
    [2], [1], ['cc'], [2], [1], ['bb'], [1], [2], ['aa'], [1], [2], ['dd']
]);
activeSheet.rowOutlines.group(3, 2);
activeSheet.rowOutlines.group(6, 2);
activeSheet.rowOutlines.group(9, 2);
activeSheet.rowOutlines.group(12, 2);
spread.resumePaint();

// rowFilter 설정
activeSheet.rowFilter(new GC.Spread.Sheets.Filter.HideRowFilter(new GC.Spread.Sheets.Range(3, 0, 13, 1)));

// 1) 필터 대화상자를 이용해 UI에서 그룹화된 데이터를 정렬하고자 할 경우, RangeSorting 이벤트를 사용합니다.
spread.bind(GC.Spread.Sheets.Events.RangeSorting, function (e, info) {
    // GroupSort를 full로 설정
    info.groupSort = GC.Spread.Sheets.GroupSort.full;
});
           
// 2) API를 사용하여 그룹화된 데이터를 정렬하고자 할 경우 다음과 같이 사용합니다:
//activeSheet.sortRange(3, 0, 13, 1, true, [{ index: 0, ascending: true }], { groupSort: GC.Spread.Sheets.GroupSort.full });
```