Skip to content

テキストパネル

概要

テキストパネル(template_type: 'TEXT_PANEL_CHART')では、データソースのSQLの実行結果の 1行目 から指定したカラムの値を取得し、テキストとして表示します。生成AIと組み合わせてデータのサマリーを表示する用途に利用できます。

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

設定例

KPIサマリの本文表示

monthly_summary テーブルから今月のサマリ(summary_md)を取得して表示する場合、次のように設定します。

md
:::sql-block
```sql
SELECT
  summary_md
FROM
  monthly_summary
ORDER BY
  target_month DESC
LIMIT 1
```

```yaml {.chart}
chartSettings:
  template_type: TEXT_PANEL_CHART
  component_settings:
    text_column:
      - field: summary_md
```
:::
  • データソースのSQLの実行結果として出力されるカラムを、チャート設定内で参照します
  • text_column に表示するカラム(1つのみ・必須)を指定
    • データソースの先頭1行の値 が表示対象になります

表示のカスタマイズ

レンダリングモードの設定

display_settings.render_mode で、テキストの描画方法を切り替えられます。

説明
markdown値をマークダウンとしてレンダリング(デフォルト)
raw値をプレーンテキストとしてそのまま表示

フォントサイズの設定

display_settings.base_font_size で、テキストの基準フォントサイズを変更できます。

型定義

  • 以下の型については、該当ドキュメントを参照してください
ts
type ChartSettings = {
  template_type: 'TEXT_PANEL_CHART';
  component_settings: {
    name?: string;  // チャートの名前を指定
    text_column: [RawField];   // 1つのみ必須
  };
  display_settings?: {
    render_mode?: 'markdown' | 'raw';   // デフォルトは 'markdown'
    base_font_size?: BaseFontSize;
  };
};