# 확장 방향 설정

## Content

셀 확장 방향은 하나의 셀에서 인접 셀로 데이터가 자동으로 넘쳐 확장되는 방향을 의미하며, 결과를 수용하기 위해 셀이 필요에 따라 확장됩니다. 리포트 시트에서 데이터가 셀에 확장되는 방식을 제어하려면 `setTemplateCell` 메서드의 `spillDirection` 속성 값을 설정합니다.
SpreadJS는 `spillDirection` 속성에 대해 다음과 같은 값을 지원합니다:

| **속성 값** | **결과** |
| ---- | --- |
| spillDirection: 'Vertical' | ![image](https://cdn.mescius.io/document-site-files/images/ef9b66d1-0ae2-4e94-b8cb-f9f893aacc8d/SpillDerection_vertical.781f59.png) |
| spillDirection: 'Horizontal' | ![image](https://cdn.mescius.io/document-site-files/images/ef9b66d1-0ae2-4e94-b8cb-f9f893aacc8d/SpillDerection_Horizontal.6d416b.png) |
| spillDirection: 'None' | ![image](https://cdn.mescius.io/document-site-files/images/ef9b66d1-0ae2-4e94-b8cb-f9f893aacc8d/SpillDerection_none.b855e4.png) |

템플릿 시트에서 확장 방향을 설정하는 단계는 다음과 같습니다:

1. 데이터 매니저에서 테이블 소스를 정의합니다.
2. 템플릿 셀에서 `type` 및 `binding` 옵션을 구성합니다.
3. 템플릿 셀에서 `spillDirection` 속성 값을 설정합니다.

다음 코드는 셀에 대해 다양한 확장 방향을 설정하는 방법을 보여줍니다:

```auto
// 수직 확장 방향 설정
templateSheet.setTemplateCell(1, 0, {
     type: 'Group',
     binding: `Orders[CustomerId]`,
     spillDirection: 'Vertical',  
});

// 수평 확장 방향 설정
templateSheet.setTemplateCell(1, 0, {
     type: 'Group',
     binding: `Orders[CustomerId]`,
     spillDirection: 'Horizontal',  
});

// 확장 없음 설정
templateSheet.setTemplateCell(1, 0, {
     type: 'Group',
     binding: `Orders[CustomerId]`,
     spillDirection: 'None',  
});
```