Blazor Gantt Chart Example - Critical Path Analysis
The critical path is a series of tasks (or sometimes only a single task) that controls the calculated finish date of the project. If a task in a critical path is delayed, then the entire project will be delayed.
ID | Job Name | Start Date | End Date | Duration | Progress | Dependency |
|---|
| 1 | Planning and Permits | 4/2/2025 | 4/8/2025 | 5 days | 100 | |
| 2 | Site Evaluation | 4/2/2025 | 4/3/2025 | 2 days | 100 | |
| 3 | Obtain Permits | 4/4/2025 | 4/8/2025 | 3 days | 100 | 2FS |
| 4 | Site Preparation | 4/9/2025 | 4/16/2025 | 6 days | 75 | |
| 5 | Grading and Excavation | 4/9/2025 | 4/11/2025 | 3 days | 100 | 3FS |
| 6 | Foundation and Basement | 4/14/2025 | 4/16/2025 | 3 days | 50 | |
| 7 | Basement Walls | 4/14/2025 | 4/16/2025 | 3 days | 50 | 5FS |
| 8 | Framing | 4/17/2025 | 4/22/2025 | 4 days | 0 | |
| 9 | Frame Floors | 4/17/2025 | 4/18/2025 | 2 days | 0 | 7FS |
| 10 | Install Trusses | 4/21/2025 | 4/22/2025 | 2 days | 0 | 9FS |
| 11 | Roofing | 4/23/2025 | 4/25/2025 | 3 days | 0 | 10FS |
| 12 | Mechanical, Electrical, Plumbing | 4/28/2025 | 5/5/2025 | 6 days | 0 | |
| 13 | HVAC Installation | 4/28/2025 | 4/30/2025 | 3 days | 0 | 11FS |
| 14 | Electrical Installation | 5/1/2025 | 5/5/2025 | 3 days | 0 | 13FS |
| 15 | Interior Finishing | 5/6/2025 | 5/15/2025 | 8 days | 0 | 14FS |
| 16 | Insulation and Drywall | 5/6/2025 | 5/12/2025 | 5 days | 0 | 14FS |
| 17 | Final Fixture Installation | 5/13/2025 | 5/15/2025 | 3 days | 0 | 16FS |
| 18 | Final Inspection | 5/16/2025 | 5/20/2025 | 3 days | 0 | 17FS |
| 19 | Client Handover | 5/21/2025 | 5/22/2025 | 2 days | 0 | 18FS |
| 20 | Celebrate Project Completion | 5/23/2025 | 5/27/2025 | 3 days | 0 | 19FS |
Mar 30, 2025 | Apr 06, 2025 | Apr 13, 2025 | Apr 20, 2025 | Apr 27, 2025 | May 04, 2025 | May 11, 2025 | May 18, 2025 | May 25, 2025 |
S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S |
In this example, how to render a Gantt chart with critical path. The default timeline view week-day mode is applied to Gantt chart. The dependency lines are enabled in this example to represent the execution order or the hierarchy between the phases.
The critical path can be enabled in Gantt by using the built-in toolbar button or EnableCriticalPath property. Any CRUD operations trigger in this demonstration causes critical path validation to be verified, after which the taskbar and connector lines are highlighted.
More information on the critical path can be found in this documentation section.