테이블 시트 생성

이 항목에서는 아래에 설명된 사용 사례 시나리오를 통해 스프레드시트에서 테이블 시트를 생성하는 방법을 설명합니다.

사용 사례 시나리오

물류 수입 및 유통 회사가 백엔드 데이터베이스에 있는 고객 정보와 관련된 대량의 데이터를 처리하고자 한다고 가정해보겠습니다.

테이블 시트는 대량의 데이터를 표시하고 관리하는 데 도움이 되며, 사용자가 데이터를 정렬, 필터링, 그룹화하여 분석할 수 있도록 합니다.

테이블 시트를 생성하려면 아래 단계를 따르시기 바랍니다.

1. Workbook.addSheetTab 메서드를 사용하여 SheetType이 "tableSheet"인 시트를 추가해 테이블 시트를 초기화합니다.

       //tablesheet 초기화
       var sheet = spread.addSheetTab(0, "TableSheet1", GC.Spread.Sheets.SheetType.tableSheet);

2. DataManager 메서드를 사용하여 데이터 매니저를 초기화합니다.

       //데이터 매니저 초기화
       var dataManager = spread.dataManager();

3. addTable 메서드를 사용하여 데이터 매니저에 테이블을 추가합니다. 이 메서드는 테이블 이름(문자열)과 IDataSourceOption 인터페이스 옵션을 인자로 받습니다.

   
   

   IDataSourceOption 인터페이스는 두 가지 유형의 데이터 소스를 설정할 수 있습니다:

   • data – JSON의 객체 배열, CSV 문자열 또는 XML 형식의 로컬 데이터 소스

   • remote – REST API, OData, GraphQL을 지원하는 원격 데이터 소스

       //데이터 매니저에 데이터 추가
       var myTable = dataManager.addTable("myTable", {
           remote: {
               read: {
                   url: 'https://demodata.grapecity.com/wwi/api/v1/customers'
               }
           }
       });

   데이터 연산에 대한 자세한 내용은 “데이터 작업” 항목을 참고하시기 바랍니다.

4. addView 메서드를 사용하여 데이터 매니저의 테이블에 뷰(View)를 추가하고, 열 정보를 정의합니다.

   
   

   기본적으로 뷰는 테이블의 모든 기본 열을 포함합니다. 열 속성과 기타 뷰 옵션에 대한 자세한 내용은 테이블 시트 뷰 항목을 참고하시기 바랍니다.

   var view = myTable.addView("myView"); // 이 뷰는 테이블의 모든 기본 열을 포함

5. fetch 메서드를 사용하여 데이터 매니저 테이블에서 데이터를 가져온 후, setDataView 메서드를 사용하여 가져온 뷰를 테이블 시트에 바인딩합니다.

   
   

   fetch 메서드는 테이블과 뷰 각각에 대해 호출할 수 있으며, 해당 데이터가 반환됩니다.

   //테이블 시트에 뷰 바인딩
   myTable.fetch().then(function () {
       var view = myTable.addView("myView");
       sheet.setDataView(view);
   });