Codatum CLI

Appearance

ピボットテーブル ​

概要 ​

ピボットテーブル（template_type: 'PIVOT_TABLE_V2'）では、行(rows)と列(cols)のディメンションでクロス集計したメトリクス(values)を表形式で表示します。

事前にチャート設定についても確認してください。

設定例 ​

地域×カテゴリ別の売上集計 ​

地域(region)を行、カテゴリ(category)を列、売上(sales_amount)を集計値としてクロス集計表示する場合、次のように設定します。

md
:::sql-block
```sql
SELECT
  region,
  category,
  sales_amount
FROM
  product_sales
```

```yaml {.chart}
chartSettings:
  template_type: PIVOT_TABLE_V2
  component_settings:
    rows:
      - field: region
    cols:
      - field: category
    values:
      - field: sales_amount
        aggregator: SUM
    rows_sort: VALUE_DESC
    cols_sort: VALUE_DESC
```
:::
  • データソースのSQLの実行結果として出力されるカラムを、チャート設定内で参照します
    • 以降の設定例では、データソースの定義は省略し、chartSettings の中身のみを記述しますが、チャート設定からは必ずデータソースのカラムを参照する必要があります
  • rows に行となるディメンション（複数指定可・任意）を指定
  • cols に列となるディメンション（複数指定可・任意）を指定
  • values に集計するメトリクス（最低1つ必須・複数指定可）を指定
  • rows_sort / cols_sort で行・列の並び順を指定（デフォルトは VALUE_DESC）
    • カスタムソートは rows_sort_custom / cols_sort_custom で指定できます
    • ソートの詳細はデータのソートを参照してください

行に複数階層を持つ集計 ​

行を地域(region)・都道府県(prefecture)の2階層、列を月(order_month)とした集計の場合、次のように設定します。

yaml
template_type: PIVOT_TABLE_V2
component_settings:
  rows:
    - field: region
    - field: prefecture
  cols:
    - field: order_month
  values:
    - field: sales_amount
      aggregator: SUM
    - field: order_count
      aggregator: SUM
  • rows / cols には複数のディメンションを階層的に指定できます
  • values を複数指定すると、列方向にメトリクスが並びます

データ加工オプション ​

行列の件数制限 ​

  • ピボットテーブルでは、行と列の件数はそれぞれ30件までに制限されています
    • 30件を超えた項目は Others にまとめて集計されます
    • この制限はチャートの描画用のデータ上限1000件（> (30 + 1) ✕ (30 + 1) = 961）によるもので、この上限件数を変更することはできません
  • ただし、以下の場合はこの制限は適用されません
    • インメモリによるデータ加工が適用されている場合
      • インメモリ処理は、データソースのクエリ実行結果が1000件以下で、カスタムSQLの指定がない場合に適用されます
    • 行か列のいずれかしか指定されていない場合
      • この場合、1000 件までのデータを描画できます

表示のカスタマイズ ​

レイアウトの設定 ​

display_settings.layout で、行階層の表示形式をカスタマイズできます。

ts
type LayoutSettings = {
  hierarchyType?: 'grid' | 'tree';   // 階層の表示形式。デフォルトは 'grid'
                                     // 'tree' は rows が2つ以上の場合のみ指定可能
  treeCollapseAll?: boolean;         // 'tree' の場合に初期状態を折りたたんで表示する場合は true
};

計算オプション ​

display_settings.calculation で、行・列の合計の表示有無を制御できます。

ts
type CalculationSettings = {
  disableRowTotal?: boolean;   // 行の合計を非表示にする場合は true を指定
  disableColTotal?: boolean;   // 列の合計を非表示にする場合は true を指定
};

テーブル全体の設定 ​

display_settings.table_common で、テーブル全体のフォントサイズや行の高さをカスタマイズできます。

ts
type TableCommonSettings = {
  base_font_size?: BaseFontSize;     // 基準フォントサイズ
  header_row_height?: number;         // ヘッダ行の高さ(px)
  data_row_height?: number;           // データ行の高さ(px)
};

フィールドごとの設定 ​

display_settings.each_fields で、各フィールド単位の表示をカスタマイズできます。カラムを特定するキーを使ってフィールドと紐づけます。

ts
type EachFieldSettings = {
  percentView?: 'NONE' | 'GRAND_TOTAL' | 'ROW_TOTAL' | 'COL_TOTAL';
                                  // 構成比の表示。デフォルトは 'NONE'
                                  // 'GRAND_TOTAL': 総計に対する構成比
                                  // 'ROW_TOTAL'  : 行合計に対する構成比
                                  // 'COL_TOTAL'  : 列合計に対する構成比
  width?: number;                 // カラムの幅(px)
  formatter?: FormatterSettings;  // 値の書式設定
  conditional_styles?: ConditionalStyle[];  // 条件付き書式
  disableInlineBarChart?: boolean;  // 数値カラムのインラインバーチャートを無効にする場合は true を指定
};
  • formatter で値の書式を指定できます。詳細はフォーマッター設定を参照してください
  • conditional_styles で値に応じた背景色・文字色を設定できます。詳細は条件付き書式を参照してください
  • 数値の値カラムでは、デフォルトでセル内にインラインバーチャートが表示されます。非表示にする場合は disableInlineBarChart: true を指定してください

型定義 ​

ts
type ChartSettings = {
  template_type: 'PIVOT_TABLE_V2';
  component_settings: ComponentSettingsCommon & {
    values: MetricsField[];        // 最低1つ必須
    rows: DimensionField[];        // 空配列可
    cols: DimensionField[];        // 空配列可
    rows_sort?: AxisSortType;      // デフォルトは 'VALUE_DESC'
    rows_sort_custom?: SqlOrderBy[];
    cols_sort?: AxisSortType;      // デフォルトは 'VALUE_DESC'
    cols_sort_custom?: SqlOrderBy[];
  };
  display_settings?: {
    layout?: LayoutSettings;
    calculation?: CalculationSettings;
    table_common?: TableCommonSettings;
    each_fields?: Record<DimensionFieldInternalKey | MetricsFieldInternalKey, EachFieldSettings>;
  };
};