Skip to content

Gantt Scheduling

The scheduling engine computes task dates from durations, dependencies, calendars, and constraints. It runs automatically on every data change and propagates dates forward through your dependency graph.

Source code
---
import GanttScheduling from './GanttScheduling.vue';
---
<GanttScheduling client:only="vue" />

By default, durationDays is measured in calendar days (including weekends). Enable excludeHolidaysFromDuration to measure in working days instead:

grid.gantt = {
// …required fields
scheduling: {
excludeHolidaysFromDuration: true,
},
};

With this option, a 5-day task starting on a Monday ends on the following Friday — weekends and public holidays are skipped.

Define holidays as ISO date strings in your CalendarEntity:

grid.ganttCalendars = [{
id: 'cal-us',
name: 'US Standard',
timeZone: 'America/New_York',
workingDays: [1, 2, 3, 4, 5], // Mon–Fri
holidays: [
'2026-05-25', // Memorial Day
'2026-07-04', // Independence Day
'2026-09-07', // Labor Day
],
hoursPerDay: 8,
}];

Constraints override the automatic forward-pass scheduling. Set constraintType and constraintDate on a task:

{
id: 't5',
name: 'External Integration',
constraintType: 'start-no-earlier-than',
constraintDate: '2026-05-04', // cannot start before this date
// …other fields
}
ConstraintBehaviour
'start-no-earlier-than'Task cannot start before the constraint date
'start-no-later-than'Task cannot start after the constraint date
'finish-no-earlier-than'Task cannot finish before the constraint date
'finish-no-later-than'Task cannot finish after the constraint date
'must-start-on'Task is pinned to start on an exact date
'must-finish-on'Task is pinned to finish on an exact date

Set a deadlineDate to flag tasks that are running late without constraining the scheduler:

{
id: 't6',
name: 'Frontend Development',
deadlineDate: '2026-05-15',
// …other fields
}

The timeline renders a visual deadline marker on the bar when a task’s computed end date exceeds its deadline.

Set manuallyScheduled: true on a task to lock its dates and exclude it from automatic propagation:

{
id: 't3',
name: 'Fixed Kickoff Event',
manuallyScheduled: true,
startDate: '2026-04-20',
endDate: '2026-04-20',
// …other fields
}

Manually scheduled tasks keep their dates regardless of dependency changes upstream.

  1. Topological sort — tasks are ordered by dependency depth
  2. Forward pass — earliest start/end dates are propagated from predecessors to successors
  3. Constraint application — constraints shift dates as required
  4. Summary rollup — parent task dates are derived from their earliest/latest children
  5. Critical path — total slack is computed for all tasks (see Critical Path)