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

셀 데이터 정렬

템플릿 셀에서 정렬 옵션을 사용하면 오름차순, 내림차순 또는 사용자 정의 순서 등 원하는 순서로 데이터를 정렬할 수 있습니다. 템플릿 시트(TemplateSheet)에서 정렬 옵션을 구성하려면, 먼저 데이터 매니저에 테이블 소스를 정의해야 합니다. 그 후, 템플릿 셀에서 dataColumn 옵션에 tableName과 columnName을 설정하고, 원하는 sortOptions를 지정합니다.

참고:

  • 정렬은 리포트 데이터가 확장되기 전에 수행되므로, 리포트 데이터 생성 후 수식 계산 결과를 가져올 수 없습니다.

  • sortByCell 및 sortByFormula 방식을 사용하려면 정렬 값이 항상 문자열이므로 "=" 기호로 시작해야 합니다.

  • sortByCell 방식은 =A1 형식만 지원하며, R1C1 형식, 절대 참조 또는 사용자 지정 이름은 지원하지 않습니다.

SpreadJS에서는 다양한 방식으로 데이터를 정렬할 수 있으며, 아래에서 각 방법을 설명합니다.


열 값으로 데이터 정렬

사용자는 현재 cellNode가 어떤 데이터 열을 기준으로 정렬될지 지정할 수 있으며, 이 경우 현재 노드 및 자식 노드가 해당 부모 그룹 내에서 재정렬됩니다. 지정된 열은 현재 노드가 바인딩된 테이블의 열이어야 합니다.

다음 코드 샘플은 그룹/리스트 내에서 정렬하는 방법, 여러 개의 정렬 규칙을 사용하는 방법, 그리고 정렬 규칙이 없는 경우를 보여줍니다.

// 그룹 내 정렬 예시.
// "shipCounty" 열 기준 오름차순 정렬
templateSheet.setTemplateCell(2, 0, {
        type: "Group",
        binding: `Orders[shipCountry]`,
        sortOptions: [
            {
               asc: "shipCountry"
            }
        ]
});
// 리스트 내 정렬 예시.
// "customerId" 열 기준 내림차순 정렬
templateSheet.setTemplateCell(2, 1, {
        type: "List",
        binding: `Orders[customerId]`,
        sortOptions: [
           {
              dsc: "customerId"
           }
       ]
});

// 다중 정렬 규칙 예시.
// "shipCounty" > "sales" 순서로 정렬
templateSheet.setTemplateCell(0, 0, {
    type: "List",
    binding: `Orders[shipCountry]`,
    sortOptions: [
      {
          asc: "shipCountry"
      },
      {
          asc: "sales"
      }
    ]
});

// 기본값 (정렬 없음)
templateSheet.setTemplateCell(2, 2, {
       type: "List",
       binding: `Orders[freight]`
});

셀 값으로 데이터 정렬

사용자는 현재 cellNode가 어떤 셀 값을 기준으로 정렬될지를 지정할 수 있습니다. 이때 기준 셀 값은 해당 cellNode의 자식이어야 합니다.

참고:

  • 기준 셀에 여러 값이 있는 경우, 첫 번째 값만 사용됩니다.

  • 기준 셀로 현재 cellNode를 지정하면 자기 자신의 값을 기준으로 정렬됩니다.

다음 코드 샘플은 셀 값을 기준으로 데이터를 정렬하는 방법을 보여줍니다.

// B3 셀 값을 기준으로 정렬
templateSheet.setTemplateCell(2, 0, {
      type: "Group",
      binding: `Products[ProductName]`,
      sortOptions: [
          {
              asc: "=B3"
          }
     ]
});

templateSheet.setTemplateCell(2, 1, {
      type: "List",
      binding: `Products[UnitsInStock]`,
});


수식 값으로 데이터 정렬

수식을 정렬 기준으로 사용할 수 있으며, 이때 수식은 반드시 "=" 기호로 시작해야 합니다.

다음 코드 샘플은 수식 값을 기준으로 데이터를 정렬하는 방법을 보여줍니다.

// "=YEAR([@OrderDate])&\"/\"&MONTH([@OrderDate])" 수식 기준으로 정렬
templateSheet.setTemplateCell(3, 0, {
           type: "Group",
           binding: `Orders[orderDate]`,
           "formula": "=YEAR([@OrderDate])&\"/\"&MONTH([@OrderDate])",  // Formula
           "sortOptions": [
                    {
                        "desc": "=YEAR([@OrderDate])"
                    },
                    {
                        "asc": "=MONTH([@OrderDate])",
                        // Custom list.
                        "list": [
                            4,
                            5,
                            6,
                            7,
                            8,
                            9,
                            10,
                            11,
                            12,
                            1,
                            2,
                            3
                        ]
                    }
           ]
});

templateSheet.setTemplateCell(3, 1, {
         type: "List",
         binding: `Orders[freight]`,
});


목록 값으로 데이터 정렬

각 정렬 옵션에 정해진 값 배열을 사용하면, 해당 목록 순서대로 정렬되며, 이후 나머지는 오름차순 또는 내림차순으로 정렬됩니다.

다음 코드 샘플은 목록 값을 기준으로 데이터를 정렬하는 방법을 보여줍니다.

// ["Tofu", "Thin Bread", "Ikura Caviar"] 순서로 "Product" 정렬
// 나머지 항목은 오름차순
templateSheet.setTemplateCell(3, 0, {
       type: "List",
       binding: `Products[Id]`,
       sortOptions: [
             {
                 asc: "=B4",
                 list: ["Tofu", "Thin Bread", "Ikura Caviar"]
             },
       ]
});
templateSheet.setTemplateCell(3, 1, {
        type: "Group",
        binding: `Products[ProductName]`,
});
templateSheet.setTemplateCell(3, 2, {
        type: "List",
        binding: `Products[UnitPrice]`,
});


디자이너를 사용한 셀 데이터 정렬

디자이너에서도 리포트 셀(Report Cell) 속성 패널의 정렬(Sort) 옵션을 사용하여 데이터를 정렬할 수 있습니다.

추가(Add) 버튼을 클릭하여 정렬 규칙을 추가하고, 정렬 순서를 오름차순/내림차순으로 변경하거나, 열/셀 기준 정렬을 설정하고, 사용자 지정 목록(Custom List) 옵션을 통해 사용자 정의 정렬도 가능합니다.

또한, 위/아래/삭제(Up/Down/Remove) 버튼을 통해 정렬 규칙의 순서를 조정하거나 삭제할 수도 있습니다.

image