[]
        
(Showing Draft Content)

셀 확장/축소

SpreadJS는 리포트 시트내 셀의 확장 및 축소 상태를 제어하여 리포트 관리 기능을 향상시킵니다. 특정 입력에 따라 개별 셀을 확장하거나 축소하는 것 외에도, 사용자는 특정 부모 셀 또는 템플릿 셀에 연결된 모든 셀을 한 번에 확장 또는 축소할 수 있습니다.

계층형 데이터 관리를 간소화하기 위해, SpreadJS는 toggleCollapseState 메서드를 제공합니다. 이 메서드는 리포트 시트 클래스에서 제공되며, 특정 부모 셀의 모든 자식 셀을 한 번에 확장하거나 축소할 수 있도록 해줍니다.

다음 예제 코드는 toggleCollapseState 메서드를 사용하여 특정 셀에 연결된 모든 자식 셀의 확장 또는 축소 상태를 전환하는 방법을 보여줍니다:

// 특정 셀 지정
var regionCells = reportSheet.getCells(2, 0);
var secondRegionCell = regionCells[1];

// 현재 축소 상태 가져오기
var isCollapsed = reportSheet.getCollapseState(secondRegionCell.row, secondRegionCell.col);

// 축소 상태 토글
var newCollapsedState = isCollapsed ? "Expanded" : "Collapsed";

// 해당 셀의 모든 자식 셀 확장 또는 축소
reportSheet.toggleCollapseState(secondRegionCell.row, secondRegionCell.col, newCollapsedState, true);

아래 GIF는 East China 및 North China와 같은 그룹 셀의 확장 및 축소 동작을 보여줍니다. 이 예제에서는 North China 그룹에 포함된 자식 셀들만 확장 또는 축소됩니다.


1

SpreadJS 디자이너 사용하기

특정 부모 셀 하위에 있는 모든 자식 셀의 확장/축소를 제어하려면, 다음 단계를 따르시기 바랍니다.

  1. 확장 또는 축소하려는 자식 셀들을 포함한 그룹 셀을 선택합니다.

    image

  2. 선택한 셀을 마우스 오른쪽 버튼으로 클릭하여 컨텍스트 메뉴를 연 후, 모두 축소(Collapse All) 또는 모두 확장(Expand All) 을 선택하여 원하는 동작을 수행합니다.

    dsdAsk ChatGPT

    image