[]
DEMOS DOC DESIGNER API
DOWNLOAD
(Showing Draft Content)

테이블 시트 디자인 모드

SpreadJS는 테이블 시트 뷰에서 자유 헤더 영역과 다중 헤더를 생성하고 편집할 수 있는 디자인 모드를 제공합니다. 테이블 시트 디자인(TABLE SHEET DESIGN) 탭의 디자인 모드(Design Mode) 리본 버튼을 클릭하여 디자인 모드에 진입할 수 있습니다.


image


선택한 행 앞에 새 행을 추가하려면 행 머리글의 “+” 버튼을 클릭하세요. 마찬가지로, 선택한 행을 삭제하려면 행 머리글의 “-” 버튼을 클릭합니다.


image


변경 사항을 적용하고 디자인 모드를 종료하려면, 다시 한 번 “디자인 모드(Design Mode)” 리본 버튼을 클릭하세요.

자유 헤더 영역

자유 헤더 영역의 편집 상태로 들어가려면 셀을 더블 클릭하세요. 값은 언제든지 수정할 수 있으며, 스타일 적용과 열 그룹화도 지원합니다.



다중 열 헤더

여러 열에 대해 같은 값을 각 열 셀에 입력하면 자동 병합이 되어 다중 열 헤더 캡션을 추가할 수 있습니다. 값은 디자인 모드에서만 수정 가능하며 스타일은 지원되지 않습니다. 다중 헤더 구간에 유일한 행이 비어 있을 경우 기본 캡션이 사용됩니다.



그룹 레이아웃 설정

테이블 시트 디자인(TABLE SHEET DESIGN) 탭의 그룹(Group) 섹션에 있는 그룹 레이아웃(Group Layout) 드롭다운에서 원하는 레이아웃을 선택하여 그룹화된 데이터의 표시 방식을 최적화할 수 있습니다.


image


그룹 레이아웃이 개요 형식(Outline) 또는 압축 형식(Condensed) 모드로 설정된 경우, 위치(Group Spacing) 옵션에서 원하는 값을 선택하여 그룹 간의 간격을 조절할 수 있습니다.


image


SpreadJS 디자이너 컴포넌트는 테이블 시트 오른쪽에 위치한 테이블 시트 패널을 사용하여 집계 수식, 캡션 또는 기타 그룹화 필드를 설정할 수 있도록 지원합니다.


image


SpreadJS에서 다중 캡션 헤더, 자유 헤더 영역 및 기타 그룹 레이아웃 설정을 적용하는 방법은 테이블 시트 뷰를 참조하세요.

수식 실행

데이터 원본(DataSource)의 열(Columns) 탭에서 수식 실행이 필요한 열을 선택한 후, 아래로 스크롤하여 수식 실행 섹션에서 수식을 정의할 수 있습니다.


image


'언제(When)'에서 해당 옵션을 선택하고, 수식(Formula) 텍스트 박스에 수식을 입력합니다. “임의 필드(Any Field)” 체크박스를 선택하면 필드의 어떤 변경 사항이든 수식을 실행하도록 감지합니다. 또는 드롭다운 메뉴에서 개별 필드를 선택할 수도 있습니다.


image