グループ化

テーブルシートは、指定されたフィールドによるデータソースのグループ化、つまり、同じ内容のセルを1つのセルに自動的にマージすることをサポートしています。グループ化された列は、次の種類の列で構成されます。

• ベース列： 元の列値が含まれます。

• サマリー列： ユーザー定義数式で計算された集計結果が含まれます。

• スライス列： 集計結果のスライス（集計結果を項目ごとに分割して集計した列）が含まれます。

次の画像は、テーブルシートグループ化のさまざまな列種類を示しています。

テーブルシートクラスのgroupByおよびremoveGroupByメソッドを使用して、それぞれグループ化およびグループ化の解除ができます。次のサンプルコードは、サマリー列とスライサ列を含むグループ化された列を追加する方法を示しています。

function grouping() {
    // サマリーフィールドとスライスフィールドを使用して、単一フィールド（Selling package）でgroupByを作成します。
    sheet.groupBy([
        {
            caption: "Selling Package", field: "sellingPackage", width: 150, style: { backColor: "#F9CA9A" },
            summaryFields: [
                {
                    caption: "SUM(Unit Price)",
                    formula: "=SUM([unitPrice])",
                    slice: { field: "=YEAR([@validFrom])", width: 120, style: { backColor: "#FCE3CA", formatter: "#,##0.00" } },
                    width: 150,
                    style: { backColor: "#FAD7B2", formatter: "#,##0.00" }
                }
            ]
        }
    ]);
}

グループ化レイアウト

テーブルシートには、表形式、アウトライン、および統合されたグループ化レイアウトを提供します。レイアウトを設定するには、groupLayout.modeプロパティを使用してモードを切り替えます。

表形式モード

このモードでは、フィールド、集計、およびスライスをグループ化するためのカテゴリ列または計算列が生成されます。次の画像は、「Office」列を基準にデータをグループ化する表形式レイアウトを示します。

次のサンプルコードは、表形式のグループ化レイアウトを実装する方法を示します。

sheet.options.groupLayout.mode = GC.Spread.Sheets.TableSheet.GroupLayoutMode.tabular; 

アウトラインモード

このモードでは、グループ化フィールドの名前と値がグループヘッダーに追加され、各グループ項目が階層表示されます。次の図は、アウトラインモードを示します。

次のサンプルコードは、アウトライングループ化レイアウトを実装する方法を示します。

sheet.options.groupLayout.mode = GC.Spread.Sheets.TableSheet.GroupLayoutMode.outline; 

統合モード

このモードでは、すべてのグループヘッダーとグループフッターの情報と集計結果を1行に統合することで、グループヘッダーとグループフッターの高さを小さくし、これにより表示を効率化します。次の図は、統合モードを示します。

次のサンプルコードは、統合されたグループ化レイアウトを実装する方法を示します。

sheet.options.groupLayout.mode = GC.Spread.Sheets.TableSheet.GroupLayoutMode.condensed; 

制限

• アウトラインモードと統合モードでは、スライスのグループ化設定は表示しません。一方、表形式レイアウトにはpositionプロパティとrelateToプロパティの設定は表示しません。

• アウトラインモードと統合モードでは、グループヘッダーまたはグループフッターに複数の集計結果が表示されている場合、先頭の集計結果のみを表示するように設定できます。

• アウトラインモードと統合モードでは、detailColumnsVisibleメソッドは使えません。

注意: SpreadJS デザイナを使用してこれらのグループ化レイアウトを設定できます。詳細については、テーブルシートのデザインモードを参照してください。