Gantt (Legacy)

The original SVG-based Gantt engine. Kept for backward compatibility — new projects should use GanttChart.

Not recommended for new code. Gantt is the original SVG-based engine — no tree pane, no hierarchy, no commit gate, a fixed 5-scale zoom range. It still ships unchanged in Lumeo.Gantt for existing consumers. New projects should use GanttChart, the actively developed engine with dependency arrows, milestones, hierarchy, a real drag commit gate, and 7 zoom levels.

Installation

dotnet add package Lumeo.Gantt

One-time app setup (AddLumeo(), CSS & JS) is covered in the installation guide.

Usage

@using Lumeo

<Gantt />

Dependencies & licensing — fully MIT, no third-party deps. Originally wrapped Frappe Gantt v1.x, but since 2.0 the Gantt is rendered by ~400 lines of custom Lumeo SVG code shipping in Lumeo.Gantt. Zero JS dependencies, zero CDN downloads, zero theming surprises. All MIT.

Basic project plan

Drag to reschedule + change progress

Drag a bar to move it, or drag the right edge to resize. Drag the progress handle (bottom of the bar) to change completion.

Last change

Drag a bar to see it here.

View modes

Use the built-in toolbar above the chart to toggle between Day, Week, Month, and Year. Pass GanttViewMode.QuarterDay or GanttViewMode.HalfDay programmatically for hour-granularity views.

Grouping / swim-lanes

Pass a GroupBy function and/or set GroupLabel on each GanttTask. Tasks are sorted by group and a section-header row is injected before the first task of each group.

Read-only

Set Readonly="true" to lock the chart — bars can't be dragged or resized.

API Reference

Gantt

GanttTask

Field	Type	Description
Id	string	Stable identifier used to reconcile drag edits back into the caller's collection.
Name	string	The label rendered on the task bar.
Start	DateTime	Start date (inclusive). Frappe Gantt works at day granularity.
End	DateTime	End date.
Progress	int	Completion percentage, 0–100. Drives the progress fill inside the bar.
Dependencies	string[]?	Ids of tasks this task depends on. Rendered as arrows in the chart. Read-only; interactive link creation is not supported by the SVG engine.
CustomClass	string?	Extra CSS class applied to the bar — use to color-code milestones or delayed work.
IsMilestone	bool	When true, renders as a diamond at the Start date. End is clamped to Start. Drag is suppressed for milestones.
GroupLabel	string?	Optional swim-lane label. When the Gantt's GroupBy parameter is set, tasks carrying the same GroupLabel are clustered together with a section header.

GanttChart — the actively developed engine: hierarchy, commit gate, 7 zoom levels.
Scheduler — calendar-style event grid when you care about time-of-day rather than project phases.
Data Grid — tabular view of the same task data when a timeline isn't needed.