Blazor Gantt Chart Example - State Persistence
This demo passes automated axe checks with 0 violations — semantic markup, ARIA, full keyboard operation, visible focus. Section 508 conformant
Accessibility report
VPAT
ID Press Enter to sort. Press Alt Down to open filter Menu. Press Alt Down to open Column Menu | Name Press Enter to sort. Press Alt Down to open filter Menu. Press Alt Down to open Column Menu | Start Date Press Enter to sort. Press Alt Down to open filter Menu. Press Alt Down to open Column Menu | End Date Press Enter to sort. Press Alt Down to open filter Menu. Press Alt Down to open Column Menu | Duration Press Enter to sort. Press Alt Down to open filter Menu. Press Alt Down to open Column Menu | Dependency Press Enter to sort. Press Alt Down to open filter Menu. Press Alt Down to open Column Menu | Progress Press Enter to sort. Press Alt Down to open filter Menu. Press Alt Down to open Column Menu |
|---|
1 | Product concept | 4/2/2021 | 4/12/2021 | 7 days | 32 | |
2 | Define the product usage | 4/2/2021 | 4/6/2021 | 3 days | 30 | |
3 | Define the target audience | 4/2/2021 | 4/5/2021 | 2 days | 40 | |
4 | Prepare product sketch and notes | 4/7/2021 | 4/12/2021 | 4 days | 2FS | 30 |
5 | Concept approval | 4/12/2021 | 4/12/2021 | 0 days | 3FS,4FS | 0 |
6 | Market research | 4/13/2021 | 4/22/2021 | 8 days | 25 | |
7 | Demand analysis | 4/13/2021 | 4/16/2021 | 4 days | 15 | |
8 | Customer strength | 4/13/2021 | 4/16/2021 | 4 days | 5FS | 30 |
9 | Market opportunity analysis | 4/13/2021 | 4/16/2021 | 4 days | 5FS | 0 |
10 | Competitor analysis | 4/19/2021 | 4/22/2021 | 4 days | 7FS,8FS | 30 |
11 | Product strength analysis | 4/19/2021 | 4/22/2021 | 4 days | 9FS | 40 |
12 | Research completed | 4/22/2021 | 4/22/2021 | 0 days | 10FS | 30 |
13 | Product design and development | 4/23/2021 | 5/19/2021 | 19 days | 31 | |
14 | Functionality design | 4/23/2021 | 4/28/2021 | 4 days | 12FS | 30 |
15 | Quality design | 4/23/2021 | 4/27/2021 | 3 days | 12FS | 40 |
16 | Define reliability | 4/28/2021 | 5/3/2021 | 4 days | 15FS | 30 |
17 | Identifying raw materials | 4/28/2021 | 4/29/2021 | 2 days | 15FS | 0 |
18 | Define cost plan | 4/30/2021 | 5/4/2021 | 3 days | 17FS | 35 |
19 | Estimate manufacturing cost | 4/30/2021 | 5/4/2021 | 3 days | 17FS | 40 |
20 | Estimate selling cost | 4/30/2021 | 5/4/2021 | 3 days | 17FS | 30 |
21 | Development of final design | 5/5/2021 | 5/19/2021 | 11 days | 32 | |
22 | Develop dimensions and design | 5/5/2021 | 5/10/2021 | 4 days | 19FS,20FS | 30 |
23 | Develop designs to meet industry | 5/11/2021 | 5/13/2021 | 3 days | 22FS | 40 |
24 | Include all the details | 5/14/2021 | 5/19/2021 | 4 days | 23FS | 30 |
25 | CAD - Computer Aided Design | 5/20/2021 | 5/24/2021 | 3 days | 24FS | 0 |
26 | CAM - Computer Aided Manufacturing | 5/25/2021 | 5/28/2021 | 4 days | 25FS | 30 |
27 | Finalize the design | 5/28/2021 | 5/28/2021 | 0 days | 26FS | 40 |
28 | Prototype testing | 5/31/2021 | 6/3/2021 | 4 days | 27FS | 30 |
29 | Include feedback | 5/31/2021 | 6/3/2021 | 4 days | 28SS | 0 |
30 | Manufacturing | 6/4/2021 | 6/10/2021 | 5 days | 28FS,29FS | 30 |
31 | Assembling material into finished goods | 6/11/2021 | 6/17/2021 | 5 days | 30FS | 40 |
32 | Final product development | 6/18/2021 | 6/28/2021 | 7 days | 17 | |
33 | Important improvement | 6/18/2021 | 6/22/2021 | 3 days | 31FS | 0 |
34 | Customer testing and feedback | 6/23/2021 | 6/28/2021 | 4 days | 33FS | 30 |
35 | Final product development | 6/29/2021 | 7/2/2021 | 4 days | 30 | |
36 | Important improvement | 6/29/2021 | 7/2/2021 | 4 days | 34FS | 30 |
37 | Address any unforeseen issues | 6/29/2021 | 7/2/2021 | 4 days | 36SS | 30 |
38 | Finalize the product | 7/5/2021 | 7/14/2021 | 8 days | 15 | |
39 | Branding the product | 7/5/2021 | 7/8/2021 | 4 days | 37FS | 30 |
40 | Marketing and presales | 7/9/2021 | 7/14/2021 | 4 days | 39FS | 0 |
Mar 25, 2021 | 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 | Jul 11, 2021 |
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 | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F |
This sample demonstrates the state management feature in the Blazor Gantt Chart. It allows saving the current chart configuration in the browser’s local storage so that settings are retained even after refreshing the page.
In this example, the Gantt Chart state is saved, reset, and reloaded to demonstrate how state management works. The chart can be refreshed to its original configuration or loaded with a previously saved state from the browser’s local storage.
The following Gantt areas are persisted:
- Grid: Sorting, filtering, column state (resize, reorder, show/hide), searching, and TreeColumnIndex.
- Splitter: Splitter position and collapsible state.
- Chart: Time span and zooming level.
This feature helps maintain a consistent experience across sessions by preserving layout and configuration preferences.
Additionally the toolbar provides the zooming operations, enabling interactive task management.
For further details, refer to the documentation.