Skip to content

データのソート

概要

チャートのデータ加工用のSQLのソート順を指定するためには AxisSortTypeSqlOrderBy を利用します。

AxisSortType によってソートの種類を指定して、 SqlOrderBy によりカスタムソートの方法を指定する場合と、SqlOrderBy でソート順を直接指定する場合があります。

ソートの指定方法

AxisSortType が指定可能な場合

  • AxisSortType が、
    • 'LABEL_ASC' | 'LABEL_DESC' | 'VALUE_ASC' | 'VALUE_DESC' の場合、
      • ラベル順や値順のソートを適用します
        • ラベルや値としてどのカラムが利用されるかは、チャートの種類ごとに異なるため、チャートごとのドキュメントを参照してください
      • SqlOrderBy[] の指定は不要です
    • 'CUSTOM' の場合、
      • SqlOrderBy[] によってカスタムソートの方法を指定します

SqlOrderBy を直接指定する場合

SqlOrderBy[] によってカスタムソートの方法を指定します

型定義

ts
type AxisSortType = 'LABEL_ASC' | 'LABEL_DESC' | 'VALUE_ASC' | 'VALUE_DESC' | 'CUSTOM';

type SqlField = {
  type: 'FIELD';
  key: string;  // カラム名を指定
};

type SqlOrderBy = {
  type: 'ORDER_BY';
  expr:
    | SqlField
    | {
        type: 'AGGREGATE_FUNCTION';
        name: 'SUM' | 'AVG' | 'COUNT_UNIQUE' | 'COUNT' | 'MAX' | 'MIN' | 'ANY_VALUE';
        args: [SqlField];
      }
    | {
        // カスタムSQLを利用する場合
        type: 'RAW_STRING';
        body: string;  // SQL文字列を指定
      };
  dir?: 'ASC' | 'DESC';
};

設定例

円グラフの表示順のソート

次のようなチャート設定で、カテゴリ(category_name)別の売上(sales)を、カテゴリID(category_id)の昇順で円グラフとして表示できます。

yaml
template_type: RADIAL_CHART_V2
component_settings:
  render_type: PIE
  x:
    - field: category_name
  ys:
    - field: sales
      aggregator: SUM
  order_by: CUSTOM
  order_by_custom:
    - expr:
        type: AGGREGATE_FUNCTION
        name: MAX
        args:
          - type: FIELD
            key: category_id
      dir: ASC
      type: ORDER_BY

上記の設定では、次のようなSQLが生成され、チャート用のデータ加工が行われます。

sql
SELECT
  category_name AS category_name___,
  SUM(IFNULL(sales, 0)) AS sales___sum
FROM
  /* データソースのSQL */  
GROUP BY
  category_name___
ORDER BY
  MAX(category_id) ASC
LIMIT
  1001