§01-05Data Visualization

ガントチャート

タスクの期間を横棒で時間軸上に並べる。

複数タスクの重なりや前後関係を時間軸で把握できる。プロジェクトの進行計画や納期の調整を関係者で共有するときに向く。

実装のポイント

日数を grid-template-columns の repeat で列に割り、開始日と期間から grid-column の span を決める。期間が長い場合は横スクロールと今日線を用意する。