This JavaScript/HTML5 Gantt chart component allows you to display a hierarchy of tasks in a timeline view, one item per row.
Drag and Drop
The JavaScript Gantt chart control supports drag and drop operations:
- task moving
- task resizing
- row moving
- link creating
Read more about Gantt drag and drop support.
Large Data Sets
The Gantt chart is optimized to handle large data sets. It will display a task hierarchy with 10,000+ tasks. Read more about large data sets.
Project Management
The Gantt chart lets you create project management applications. It supports common project management elements:
- Task groups
- Milestones
- Task dependencies - links (Start-to-Start, Start-to-Finish, Finish-to-Start, Finish-to-Finish)
- Percent complete status
Read more about project management features.
Tutorials
- HTML5 Gantt Chart Tutorial (JavaScript/PHP)
- Angular 6 Gantt Chart Tutorial (TypeScript, PHP/MySQL)
- Angular 5 Gantt Chart Quick Start Project
More Features
- jQuery Gantt plugin
- AngularJS Gantt plugin
- Full CSS styling
- Mobile and touch devices support (Android, iPad, iPhone)
- Custom time scale (minutes, hours, days, weeks, months, years)
- Non-continuous timeline (hidden weekends)
- Non-linear timeline (first month on a day scale, following year on a month scale)
- Custom columns with additional task data (duration, description, assigned resources)
- Fully customizable (custom HTML, CSS classes, colors, behavior)
- Context menu for tasks, rows, links
- Bubble with popup details
- HTML5 support
Read more in the Gantt chart documentation.