Skip to content

Commit 7970f6f

Browse files
1021730-Changed read-me content and removed outdated links.
1 parent a55d05c commit 7970f6f

2 files changed

Lines changed: 16 additions & 27 deletions

File tree

‎README.md‎

Lines changed: 15 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,28 @@
11
# React Gantt Chart with Custom Column Templates and Toolbar
22

3-
A React sample repository demonstrating `@syncfusion/ej2-react-gantt` with custom resource templates, header templates, and custom toolbar actions.
3+
A React sample repository demonstrating the Syncfusion React Gantt Chart component with custom column templates, resource rendering, and toolbar-based interactions.
44

55
## Repository description
6-
This repository contains a Create React App example rendering a Gantt chart with custom resource display and toolbar-driven filtering.
6+
This repository provides a React example that showcases a Syncfusion Gantt Chart configured with custom resource column templates, header templates, and toolbar actions for controlling filtering and task presentation.
7+
8+
## Project Overview
9+
10+
The sample focuses on extending the default Gantt chart behavior by customizing how resource information is displayed within columns and by handling toolbar actions programmatically. It highlights how template support and toolbar events can be used together to control filtering and task visibility in a structured project timeline.
711

812
## Features
913

1014
- Custom `Resources` column template
1115
- Custom `Resources` header template
12-
- Built-in toolbar buttons: `CollapseAll`, `ExpandAll`
13-
- Custom toolbar buttons: `Filter`, `Clear Filter`
14-
- Programmatic filtering via toolbar events
15-
- Nested tasks, dependencies, and resources
16-
17-
## What it demonstrates
18-
19-
- `GanttComponent` with `taskFields` mapping
20-
- `ColumnsDirective` and `ColumnDirective` customization
21-
- Custom column `template` and `headerTemplate`
22-
- Toolbar click handling
23-
- Resource mapping via `resourceDetails`
16+
- Built-in toolbar actions such as `CollapseAll` and `ExpandAll`
17+
- Custom toolbar actions for filtering and clearing filters
18+
- Programmatic filtering triggered through toolbar events
19+
- Support for nested tasks, dependencies, and resource assignment
2420

2521
## Getting Started
2622

2723
### Prerequisites
2824

29-
- Node.js
25+
- Node.js (LTS or later)
3026
- npm
3127

3228
### Install
@@ -45,14 +41,7 @@ Open `http://localhost:3000`.
4541

4642
## Notes
4743

48-
- Uses React 17 and Create React App
49-
- Loads resource images from Syncfusion demo CDN
50-
- Filter button limits resources starting with `M`
51-
- Clear Filter removes active filtering
52-
53-
## Available Scripts
54-
55-
- `npm start`
56-
- `npm run build`
57-
- `npm test`
58-
- `npm run eject`
44+
- The sample renders a `GanttComponent` configured with `taskFields` mapping.
45+
- Column customization is implemented using `template` and `headerTemplate`.
46+
- Toolbar click handlers apply and clear filters dynamically.
47+
- Resource images are loaded from a public Syncfusion demo CDN for display purposes.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
"@types/react-dom": "^16.9.10",
1414
"react": "^17.0.1",
1515
"react-dom": "^17.0.1",
16-
"react-scripts": "4.0.1",
16+
"react-scripts": "5.0.1",
1717
"typescript": "^4.1.3",
1818
"web-vitals": "^0.2.4"
1919
},

0 commit comments

Comments
 (0)