Syncfusion.Blazor.Gantt
33.2.5
Prefix Reserved
dotnet add package Syncfusion.Blazor.Gantt --version 33.2.5
NuGet\Install-Package Syncfusion.Blazor.Gantt -Version 33.2.5
<PackageReference Include="Syncfusion.Blazor.Gantt" Version="33.2.5" />
<PackageVersion Include="Syncfusion.Blazor.Gantt" Version="33.2.5" />
<PackageReference Include="Syncfusion.Blazor.Gantt" />
paket add Syncfusion.Blazor.Gantt --version 33.2.5
#r "nuget: Syncfusion.Blazor.Gantt, 33.2.5"
#:package Syncfusion.Blazor.Gantt@33.2.5
#addin nuget:?package=Syncfusion.Blazor.Gantt&version=33.2.5
#tool nuget:?package=Syncfusion.Blazor.Gantt&version=33.2.5
Syncfusion® Blazor Gantt Chart
Professional project planning and scheduling component for Blazor applications. Display and manage hierarchical tasks with timelines, resource allocation, dependencies, and Gantt chart visualizations.

Key features
- Task Management: Create, edit, and delete tasks with hierarchical structure
- Timeline View: Visual Gantt chart with customizable timeline scales
- Resource Allocation: Assign and manage resources across tasks
- Dependencies: Define and visualize task dependencies and relationships
- Scheduling: Auto-calculate dates based on duration and dependencies
- Milestone Tracking: Mark and track important project milestones
- Drag and Drop: Reschedule tasks by dragging on the timeline
- Filtering and Sorting: Filter tasks by status, resource, or custom criteria
- Export: Export project data to Excel, PDF, and other formats
Add stylesheet and script references
- For Blazor Web App / Blazor Server App, add these to
Components/App.razororApp.razorfile. - For Blazor WebAssembly App, add these to
wwwroot/index.htmlfile.
<link href="_content/Syncfusion.Blazor.Themes/bootstrap5.css" rel="stylesheet" />
<script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>
Quick start
- Register the Syncfusion® Blazor service in
Program.csfile.
using Syncfusion.Blazor;
builder.Services.AddSyncfusionBlazor();
- Add Blazor Gantt Chart component to your Razor page.
@using Syncfusion.Blazor.Gantt
<SfGantt DataSource="@TaskCollection" Height="450px">
<GanttTaskFields Id="TaskId" Name="TaskName" StartDate="StartDate" EndDate="EndDate" Duration="Duration" Progress="Progress" ParentID="ParentId"/>
<GanttColumns>
<GanttColumn Field="TaskId" HeaderText="Task ID" Width="100"/>
<GanttColumn Field="TaskName" HeaderText="Task Name" Width="250"/>
<GanttColumn Field="StartDate" HeaderText="Start Date" Format="yMd"/>
<GanttColumn Field="EndDate" HeaderText="End Date" Format="yMd"/>
<GanttColumn Field="Duration" HeaderText="Duration"/>
<GanttColumn Field="Progress" HeaderText="Progress"/>
</GanttColumns>
</SfGantt>
@code {
private List<TaskData> TaskCollection = new();
protected override void OnInitialized()
{
TaskCollection = new List<TaskData>
{
new TaskData() { TaskId = 1, TaskName = "Project initiation", StartDate = new DateTime(2024, 3, 29), EndDate = new DateTime(2024, 4, 2), Duration = 4 },
new TaskData() { TaskId = 2, TaskName = "Identify site location", StartDate = new DateTime(2024, 3, 29), EndDate = new DateTime(2024, 3, 29), Duration = 4, Progress = 30, ParentId = 1 },
new TaskData() { TaskId = 3, TaskName = "Perform soil test", StartDate = new DateTime(2024, 4, 3), EndDate = new DateTime(2024, 4, 4), Duration = 4, ParentId = 1 }
};
}
public class TaskData
{
public int TaskId { get; set; }
public string TaskName { get; set; }
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
public int Duration { get; set; }
public int Progress { get; set; }
public int ParentId { get; set; }
}
}
Documentation
- Getting Started with Blazor Web App
- Getting Started with Blazor WebAssembly App
- API Reference
- Live Demos
- Feature Overview
Support
License
This is a commercial product and requires a paid license for possession or use. Review the Syncfusion® EULA.
About Syncfusion®
Syncfusion® provides 1600+ UI components and frameworks for web, mobile, and desktop development across multiple platforms:
Web: Blazor | ASP.NET Core | ASP.NET MVC | JavaScript | Angular | React | Vue
Desktop: WinForms | WPF | WinUI
Learn more at www.syncfusion.com.
sales@syncfusion.com | Toll Free: 1-888-9-DOTNET
| Product | Versions Compatible and additional computed target framework versions. |
|---|---|
| .NET | net8.0 is compatible. net8.0-android was computed. net8.0-browser was computed. net8.0-ios was computed. net8.0-maccatalyst was computed. net8.0-macos was computed. net8.0-tvos was computed. net8.0-windows was computed. net9.0 is compatible. net9.0-android was computed. net9.0-browser was computed. net9.0-ios was computed. net9.0-maccatalyst was computed. net9.0-macos was computed. net9.0-tvos was computed. net9.0-windows was computed. net10.0 is compatible. net10.0-android was computed. net10.0-browser was computed. net10.0-ios was computed. net10.0-maccatalyst was computed. net10.0-macos was computed. net10.0-tvos was computed. net10.0-windows was computed. |
-
net10.0
- Syncfusion.Blazor.Buttons (>= 33.2.5)
- Syncfusion.Blazor.Calendars (>= 33.2.5)
- Syncfusion.Blazor.Core (>= 33.2.5)
- Syncfusion.Blazor.Data (>= 33.2.5)
- Syncfusion.Blazor.DropDowns (>= 33.2.5)
- Syncfusion.Blazor.Grid (>= 33.2.5)
- Syncfusion.Blazor.Inputs (>= 33.2.5)
- Syncfusion.Blazor.Layouts (>= 33.2.5)
- Syncfusion.Blazor.Lists (>= 33.2.5)
- Syncfusion.Blazor.Navigations (>= 33.2.5)
- Syncfusion.Blazor.Popups (>= 33.2.5)
- Syncfusion.Blazor.RichTextEditor (>= 33.2.5)
- Syncfusion.Blazor.Spinner (>= 33.2.5)
- Syncfusion.Blazor.TreeGrid (>= 33.2.5)
-
net8.0
- Syncfusion.Blazor.Buttons (>= 33.2.5)
- Syncfusion.Blazor.Calendars (>= 33.2.5)
- Syncfusion.Blazor.Core (>= 33.2.5)
- Syncfusion.Blazor.Data (>= 33.2.5)
- Syncfusion.Blazor.DropDowns (>= 33.2.5)
- Syncfusion.Blazor.Grid (>= 33.2.5)
- Syncfusion.Blazor.Inputs (>= 33.2.5)
- Syncfusion.Blazor.Layouts (>= 33.2.5)
- Syncfusion.Blazor.Lists (>= 33.2.5)
- Syncfusion.Blazor.Navigations (>= 33.2.5)
- Syncfusion.Blazor.Popups (>= 33.2.5)
- Syncfusion.Blazor.RichTextEditor (>= 33.2.5)
- Syncfusion.Blazor.Spinner (>= 33.2.5)
- Syncfusion.Blazor.TreeGrid (>= 33.2.5)
-
net9.0
- Syncfusion.Blazor.Buttons (>= 33.2.5)
- Syncfusion.Blazor.Calendars (>= 33.2.5)
- Syncfusion.Blazor.Core (>= 33.2.5)
- Syncfusion.Blazor.Data (>= 33.2.5)
- Syncfusion.Blazor.DropDowns (>= 33.2.5)
- Syncfusion.Blazor.Grid (>= 33.2.5)
- Syncfusion.Blazor.Inputs (>= 33.2.5)
- Syncfusion.Blazor.Layouts (>= 33.2.5)
- Syncfusion.Blazor.Lists (>= 33.2.5)
- Syncfusion.Blazor.Navigations (>= 33.2.5)
- Syncfusion.Blazor.Popups (>= 33.2.5)
- Syncfusion.Blazor.RichTextEditor (>= 33.2.5)
- Syncfusion.Blazor.Spinner (>= 33.2.5)
- Syncfusion.Blazor.TreeGrid (>= 33.2.5)
NuGet packages (2)
Showing the top 2 NuGet packages that depend on Syncfusion.Blazor.Gantt:
| Package | Downloads |
|---|---|
|
Cayaqui.MPS.Components
Design system and EVM/EPC reusable components (KPI strip, gauges CPI/SPI/PF, S-curves, Gantt, WBS tree grid, R9C, risk heatmap, change orders, purchase orders, engineering deliverables, lookahead grid) for .NET 10 Blazor WebApp (Interactive Server) on top of Syncfusion.Blazor. Proprietary — requires a commercial agreement with Cayaqui. |
|
|
Jakar.Extensions.Blazor.Syncfusion
Extensions to aid in development. |
GitHub repositories
This package is not used by any popular GitHub repositories.
| Version | Downloads | Last Updated |
|---|---|---|
| 33.2.5 | 0 | 5/4/2026 |
| 33.2.4 | 356 | 4/27/2026 |
| 33.2.3 | 1,746 | 4/21/2026 |
| 33.1.49 | 1,159 | 4/13/2026 |
| 33.1.47 | 688 | 4/6/2026 |
| 33.1.46 | 318 | 3/30/2026 |
| 33.1.45 | 527 | 3/23/2026 |
| 33.1.44 | 2,013 | 3/16/2026 |
| 32.2.9 | 899 | 3/9/2026 |
| 32.2.8 | 674 | 3/2/2026 |
| 32.2.7 | 1,129 | 2/23/2026 |
| 32.2.5 | 508 | 2/16/2026 |
| 32.2.4 | 829 | 2/10/2026 |
| 32.2.3 | 1,302 | 2/5/2026 |
| 32.1.25 | 454 | 1/26/2026 |
| 32.1.24 | 1,593 | 1/19/2026 |
| 32.1.23 | 1,709 | 1/13/2026 |
| 32.1.22 | 1,184 | 1/5/2026 |
| 32.1.21 | 599 | 12/29/2025 |
| 32.1.20 | 766 | 12/23/2025 |