Breadcrumb arrow Back to Code Examples

How To Schedule And Track Tasks In The Vue Gantt Chart Component

Sample date Updated on Sep 13, 2025
Browse Code Git logo Download
vue-gantt-chart-critical-path vue-gantt-chart-event-markers vue-gantt-chart-holidays vue-gantt-chart-indicators vue-gantt-chart-scheduling-concepts vue-gantt-chart-task-scheduling-mode vue-gantt-chart-unscheduled-task vue-gantt-chart-working-week

A quick-start project that shows you how to schedule tasks in a Vue Gantt Chart. This project contains code snippets to set the task scheduling mode, working weeks, holidays, unscheduled tasks, critical paths, event markers, and indicators in a Gantt chart. Gantt component features are segregated into individual feature-wise modules.

Refer to the following scheduling task documentation for the Syncfusion Vue Gantt Chart component: https://ej2.syncfusion.com/vue/documentation/gantt/task-scheduling

Check out this online example of Scheduling concepts in the Vue Gantt Chart component: https://ej2.syncfusion.com/vue/demos/#/material/gantt/taskMode.html

Refer to the following Syncfusion Vue Gantt Chart Getting Started video: https://www.youtube.com/watch?v=S1GbWmVcre0

Project prerequisites

Make sure that you have the latest versions of Vue, Node, Vue Class Component, and Visual Studio Code in your machine before starting to work on this project.

How to run this application?

To run this application, you need to clone the how-to-schedule-and-track-tasks-in-the-vue-gantt-chart repository and then open it in Visual Studio Code. Now, simply install all the necessary react packages into your current project using the npm install command and run your project using the npm run serve command.

Up arrow