Blazor Gantt Chart Example - Work Week Configuration
This demo passes automated axe checks with 0 violations — semantic markup, ARIA, full keyboard operation, visible focus. Section 508 conformant
Accessibility report
VPAT
ID | Name | Start Date | End Date | Duration | Progress | Dependency |
|---|
| 1 | Product concept | 4/2/2021 | 4/9/2021 | 5 days | 33 | |
| 2 | Defining the product usage | 4/2/2021 | 4/7/2021 | 3 days | 30 | |
| 3 | Defining the target audience | 4/2/2021 | 4/7/2021 | 3 days | 40 | |
| 4 | Prepare product sketch and notes | 4/8/2021 | 4/9/2021 | 2 days | 30 | 2FS |
| 5 | Concept approval | 4/9/2021 | 4/9/2021 | 0 days | 0 | 3FS,4FS |
| 6 | Market research | 4/10/2021 | 4/19/2021 | 8 days | 25 | |
| 7 | Demand analysis | 4/10/2021 | 4/14/2021 | 4 days | 15 | |
| 8 | Customer strength | 4/10/2021 | 4/14/2021 | 4 days | 30 | 5FS |
| 9 | Market opportunity analysis | 4/10/2021 | 4/14/2021 | 4 days | 0 | 5FS |
| 10 | Competitor analysis | 4/15/2021 | 4/19/2021 | 4 days | 30 | 7FS,8FS |
| 11 | Product strength analysis | 4/15/2021 | 4/19/2021 | 4 days | 40 | 9FS |
| 12 | Research completed | 4/19/2021 | 4/19/2021 | 0 days | 30 | 10FS |
| 13 | Product design and development | 4/20/2021 | 5/5/2021 | 14 days | 30 | |
| 14 | Functionality design | 4/20/2021 | 4/22/2021 | 3 days | 30 | 12FS |
| 15 | Quality design | 4/20/2021 | 4/22/2021 | 3 days | 40 | 12FS |
| 16 | Define reliability | 4/23/2021 | 4/24/2021 | 2 days | 30 | 15FS |
| 17 | Identifying raw materials | 4/23/2021 | 4/24/2021 | 2 days | 0 | 15FS |
| 18 | Define cost plan | 4/26/2021 | 4/27/2021 | 2 days | 35 | 17FS |
| 19 | Manufacturing cost | 4/26/2021 | 4/27/2021 | 2 days | 40 | 17FS |
| 20 | Selling cost | 4/26/2021 | 4/27/2021 | 2 days | 30 | 17FS |
| 21 | Development of final design | 4/28/2021 | 5/5/2021 | 7 days | 32 | |
| 22 | Develop dimensions and design | 4/28/2021 | 4/29/2021 | 2 days | 30 | 19FS,20FS |
| 23 | Develop designs to meet industry | 4/30/2021 | 5/1/2021 | 2 days | 40 | 22FS |
| 24 | Include all the details | 5/3/2021 | 5/5/2021 | 3 days | 30 | 23FS |
| 25 | CAD - Computer Aided Design | 5/6/2021 | 5/8/2021 | 3 days | 0 | 24FS |
| 26 | CAM - Computer Aided Manufacturing | 5/10/2021 | 5/12/2021 | 3 days | 30 | 25FS |
| 27 | Finalize the design | 5/12/2021 | 5/12/2021 | 0 days | 40 | 26FS |
| 28 | Prototype testing | 5/13/2021 | 5/17/2021 | 4 days | 30 | 27FS |
| 29 | Include feedback | 5/13/2021 | 5/17/2021 | 4 days | 0 | 28SS |
| 30 | Manufacturing | 5/18/2021 | 5/22/2021 | 5 days | 30 | 28FS,29FS |
| 31 | Assembling material to finished goods | 5/24/2021 | 5/28/2021 | 5 days | 40 | 30FS |
| 32 | Final product development | 5/29/2021 | 6/4/2021 | 6 days | 15 | |
| 33 | Important improvement | 5/29/2021 | 6/1/2021 | 3 days | 0 | 31FS |
| 34 | Customer testing and feedback | 6/2/2021 | 6/4/2021 | 3 days | 30 | 33FS |
| 35 | Final product development | 6/5/2021 | 6/9/2021 | 4 days | 30 | |
| 36 | Important improvement | 6/5/2021 | 6/9/2021 | 4 days | 30 | 34FS |
| 37 | Address any unforeseen issue | 6/5/2021 | 6/9/2021 | 4 days | 30 | 36SS |
| 38 | Final product | 6/10/2021 | 6/18/2021 | 8 days | 15 | |
| 39 | Branding product | 6/10/2021 | 6/14/2021 | 4 days | 30 | 37FS |
| 40 | Marketing and presales | 6/15/2021 | 6/18/2021 | 4 days | 0 | 39FS |
Mar 28, 2021 | Apr 04, 2021 | Apr 11, 2021 | Apr 18, 2021 | Apr 25, 2021 | May 02, 2021 | May 09, 2021 | May 16, 2021 | May 23, 2021 | May 30, 2021 | Jun 06, 2021 | Jun 13, 2021 | Jun 20, 2021 | Jun 27, 2021 | Jul 04, 2021 |
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 | 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 |
Public holiday
This sample demonstrates adaptable workweek configuration in the Blazor Gantt Chart. It demonstrates how task timelines react when project calendars define unique working day sets and mapped holiday schedules.
In this example, the Gantt Chart is rendered with a supplied data source while applying a customizable set of working days. A customized working days is applied through the WorkWeek property so duration calculations and taskbar rendering reflect only the selected working days. Weekend highlighting remains visible on the timeline when the HighlightWeekends property is enabled, making it easy to distinguish nonworking days at a glance.
For further details, refer to the documentation.