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

템플릿 셀 유형 설정

템플릿 셀 유형은 리포트시트 내에서 데이터를 효율적으로 구성할 수 있는 유용한 설정입니다. 예를 들어, 행 기반 보고서를 작성하고자 하는 경우에는 'List' 셀 유형을 사용할 수 있고, 판매 요약 보고서를 작성하려면 'Group' 및 'Summary' 셀 유형을 사용할 수 있습니다.

템플릿(TemplateSheet)에서 템플릿 셀 유형을 설정하려면 setTemplateCell 메서드를 사용하고, type과 binding 속성에 대한 값을 지정합니다.

지원되는 모든 셀 유형은 아래와 같습니다.

  • StaticCell

  • ListCell

  • GroupCell

  • SummaryCell

다음 코드 샘플은 보고서 셀에 서로 다른 템플릿 셀 유형을 설정하는 방법을 보여줍니다.

// LIST 리포트.
const columns = ['orderId', 'orderDate', 'freight', 'customerId','shipName', 'shipCity', 'shipCountry'];
columns.forEach((columnName, i) => {
       templateSheet.setValue(0, i, `${columnName[0].toUpperCase()}${columnName.substring(1)}`);
       templateSheet.setTemplateCell(1, i, {
           type: 'List',
           binding: `Orders[${columnName}]`,
       });
});           

// GROUP과 SUMMARY 리포트.
templateSheet.addSpan(1, 0, 2, 1);
templateSheet.setTemplateCell(1, 0, {
       type: 'Group',
       binding: 'Orders[CustomerId]',
});
                
templateSheet.setTemplateCell(1, 1, {
       type: 'Group',
       formula: '=YEAR([@orderDate])',
       binding: 'Orders[OrderDate]'
});

templateSheet.setTemplateCell(1, 2, {
       type: 'Summary',
       binding: 'Orders[Freight]',
});

// LIST, GROUP, and SUMMARY REPORTS
templateSheet.setTemplateCell(0, 0, {
       type: 'Group',
       binding: `Sales[Region]`,
});
templateSheet.setTemplateCell(0, 1, {
       type: 'Summary',
       binding: `Sales[Sales]`,
       aggregate: 'Sum',
});
templateSheet.setTemplateCell(0, 2, {
       type: 'List',
       binding: `Sales[Salesman]`,
});

SpreadJS 디자이너에서도 템플릿 시트 설정을 통해 이 구성을 지원합니다. 리포트 셀 속성 패널의 유형 영역에서 원하는 셀 유형을 선택할 수 있습니다.

image

선택한 셀 유형에 따라 설정 옵션이 달라집니다.

GroupCell은 기본 데이터 셀을 확장한 것으로, 고급 그룹화를 위한 추가 속성을 포함합니다. 고급 그룹화를 사용하면 조건 규칙 또는 수식 계산 결과를 기준으로 데이터를 그룹화할 수 있습니다. 이 기능은 리포트시트 내에서 데이터 구성 기능을 향상시킵니다.

IGroupBin 인터페이스의 bins 및 formula 속성을 사용하여 GroupCell에서 고급 그룹화 옵션을 정의할 수 있습니다.

속성

설명

샘플 코

고급(bins)

사용자는 bins 안에 여러 개의 사용자 정의 그룹 규칙을 추가하여 다양한 레코드를 일치시킬 수 있습니다.

caption

그룹 결과에 표시되는 이름을 나타냅니다.

sheet.setTemplateCell(1, 0, {

binding: "Sales-NY[Sales]",

type: "Group",

bins: [

{caption: "Sales <= 200", groupBy: "=([@Sales] <= 200)"},

{caption: "Sales > 200 && Sales <= 500", groupBy: "=AND([@Sales] > 200, [@Sales] <= 500)"},

{caption: "Region", groupBy: "[@Region]"},

]

});

groupBy [formula condition]

수식 결과로 데이터를 그룹화합니다.

sheet.setTemplateCell(1, 0, {

binding: "Sales-NY[Sales]",

type: "Group",

bins: [

{caption: "Sales <= 200", groupBy: "=([@Sales] <= 200)"},

{caption: "Sales > 200 && Sales <= 500", groupBy: "=AND([@Sales] > 200, [@Sales] <= 500)"},

{caption: "Sales > 500", groupBy: "=([@Sales] > 500)"},

]

});

groupBy [field]

필드 값으로 데이터를 그룹화합니다.

sheet.setTemplateCell(1, 0, {

binding: "Sales-NY[Sales]",

type: "Group",

bins: [

{caption: "Sales <= 200", groupBy: "=([@Sales] <= 200)"},

{caption: "Region", groupBy: "[@Region]"}

]

});

groupBy [blank string]

다른 조건과 일치하지 않는 레코드에 대한 기본 그룹을 나타냅니다.

sheet.setTemplateCell(1, 0, {

binding: "Sales-NY[Sales]",

type: "Group",

bins: [

{caption: "Sales <= 200", groupBy: "=([@Sales] <= 200)"},

{caption: "Sales > 200 && Sales <= 500", groupBy: "=AND([@Sales] > 200, [@Sales] <= 500)"},

{caption: "Others", groupBy: ""} // match the remaining records.

]

});

stopIfTrue

일치하는 조건을 찾은 후 그룹화를 중단할지 여부를 결정합니다. 기본값은 true입니다.

sheet.setTemplateCell(1, 0, {

binding: "Sales-NY[Sales]",

type: "Group",

bins: [

{caption: "Sales <= 200", groupBy: "=([@Sales] <= 200)"},

{caption: "Sales > 200 && Sales <= 500", groupBy: "=AND([@Sales] > 200, [@Sales] <= 500)", stopIfTrue: false},

{caption: "Sales >= 500", groupBy: "=([@Sales] >= 500)"},

]

});

alwaysVisible

레코드와 일치하지 않는 그룹(빈 그룹)을 결과에 표시할지를 결정합니다.

sheet.setTemplateCell(1, 0, {

binding: "Sales-NY[Sales]",

type: "Group",

bins: [

{caption: "Sales < 0", groupBy: "=([@Sales] < 0)", alwaysVisible: true},

{caption: "Sales <= 200", groupBy: "=([@Sales] <= 200)"},

{caption: "Sales > 200 && Sales <= 500", groupBy: "=AND([@Sales] > 200, [@Sales] <= 500)"},

{caption: "Sales > 500", groupBy: "=([@Sales] > 500)"},

]

});

고급(formula)

수식을 사용하여 모든 레코드를 계산한 후, 수식 계산 결과로 그룹화할 수 있습니다.

formula

테이블 필드로부터 계산된 값을 기준으로 데이터를 그룹화합니다.

sheet.setTemplateCell(1, 0, {

binding: "Orders[orderDate]",

type: "Group",

formula: "=YEAR([@orderDate])"

});

sheet.setTemplateCell(1, 1, {

binding: "Orders[orderDate]",

type: "Group",

formula: "=MONTH([@orderDate])"

});

참고:

  • bins 규칙의 groupBy 수식에서는 [@columnName] 같은 구조 참조 및 정적 값을 지원합니다.

    셀 참조는 지원하지 않습니다.

  • 고급 그룹 수식에서는 해당 셀에 바인딩된 테이블의 열만 사용할 수 있습니다.