レコードの時系列チャート表示
概要¶
テーブルに格納された「レコード」を時系列チャート形式で表示します。
前提条件¶
- 読取り権限が必要です。
操作手順¶
- テーブルの一覧画面を開いてください。
- 「表示」メニューを開き時系列チャートをクリックしてください。
表示の切り替え項目¶
時系列チャートでは、「面」と「折れ線」の2種類からチャートを選択できます。
面チャートと折れ線チャートの切り替えについての画面イメージは次のとおりです。
面チャート¶
折れ線チャート¶
縦軸および横軸は、チャート上部の各項目を選択することで切り替えが行えます。
| No | 項目 | 説明 |
|---|---|---|
| 1 | 分類 | 縦軸を分類項目から選択します。 |
| 2 | 集計種別 | 「件数」、「合計」、「平均」、「最大」、「最小」から選択します。 |
| 3 | 集計対象(※1) | 任意の数値項目または「作業量」、「残作業量」から選択します。 |
| 4 | チャートの種類 | 「面」または「折れ線」から選択します。 |
| 5 | 横軸 | 任意の日付項目または履歴、「開始」、「完了」から選択します。 |
※1 「集計対象」項目は、「集計種別」の「件数」以外を選択した場合のみ画面に表示されます。
チャート表示の内容について¶
「チャートの種類」の選択、「横軸」項目の選択によってチャート表示の内容が異なります。
面チャート¶
| 横軸 | チャート表示 |
|---|---|
| 履歴 | 各分類の要素を上に積み上げたチャート |
| 履歴以外 | 各分類の要素を個別に集計したチャート |
折れ線チャート¶
| 横軸 | チャート表示 |
|---|---|
| 全ての項目 | 各分類の要素を個別に集計したチャート |
折れ線チャートの表示色について¶
折れ線チャートの表示色は、Java Scriptのライブラリ「D3.js」で使用できるカラーセットを利用しています。チャートの識別がしやすいよう、表示数によって使用するカラーセットが異なります。
| 表示数 | カラーセット | d3-scale名称 |
|---|---|---|
| 10個以下 | 10色のカラーセット | d3.schemeCategory10 |
| 11個以上 | 20色のカラーセット | d3.interpolateRainbow |
参考URL¶
https://github.com/d3/d3-scale-chromatic/blob/main/README.md
時系列チャートの設定¶
時系列チャートの設定を変更することができます。この操作はサイトの管理権限が必要です。
| 項目名 | 説明 | 設定方法 |
|---|---|---|
| 有効 | 時系列チャートの有効化/無効化を設定 | チェックすることで時系列チャートを有効化 |
- 画面下部の「更新」ボタンをクリックしてください。


