Appearance
テキストパネル
概要
テキストパネル(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;
};
};