The Blazor Gantt Chart is a project planning and management tool that provides a Microsoft Project-like interface to display and manage hierarchical tasks with timeline details. This quick-start project that helps you create a Blazor Gantt Chart of Syncfusion in the Blazor WebAssembly application. In this example, you can learn how to add prominent features like timeline view, editing, and filtering.
- Visual Studio 2022
- Checkout this project to a location in your disk.
- Open the solution file using the Visual Studio 2022.
- Restore the NuGet packages by rebuilding the solution.
- Run the project.
To get more help, check the ASP.NET Core Blazor documentation.
Data binds seamlessly with various local and remote data sources such as JSON, RESTful services, OData services, and WCF services.
The Blazor Gantt Chart supports different configurable timeline views: hour, day, week, month, and year.
Create relationships among different tasks to determine the execution order using finish-to-start, start-to-finish, start-to-start, and finish-to-finish task link types.
Edit the task's fields directly in their respective cells using a dialog or interactively using taskbars.
The Blazor Gantt Chart provides built-in support for unscheduled tasks. These are tasks not scheduled with proper dates or duration at the start of the project, but can be scheduled properly at any time during the project implementation based on factors such as resource availability and dependent tasks.
Data across all columns can be filtered using menu filtering and toolbar search options.
The Blazor Gantt Chart allows users to sort a column in the ascending or descending order by simply clicking the header. A Ctrl + header click performs multi-sorting.
The Blazor Gantt Chart allows users to select rows or cells by simply clicking them. More than one row or cell can be selected by holding the Ctrl or Shift key, or programmatically. A range of cells can be selected by dragging the pointer over cells. This helps copy the selected rows or cells to the clipboard.
Columns define the schema of a data source in the Blazor Gantt Chart. They support formatting, column definitions, column chooser, column menu, column reordering, and other features.
Enable and disable the Gantt editing operations using the read-only option.
Customize the appearance and style of the taskbars using templates.
By selecting the rows in the tree grid section, the tasks that are not visible in the viewport get focused.
The tooltip displays task information, editing actions for the taskbar, and connector lines when the mouse hovers over the task.
Highlight important days or events in a project using event markers.
A data marker in a chart represents an important event, which occurred on a specific data point. Hovering on a data marker shows an additional description of the event in the tooltip.
Use toolbar options for editing, searching, expanding, collapsing, and deleting selected tasks along with an option to add a new task.
User-friendly touch gestures and an interactive UI design on Blazor Gantt Chart help produce the best user experience. All Gantt Chart features work on touch devices with zero configuration.
Allows the Blazor Gantt Chart layout to be viewed on various devices. It is also possible to hide specific columns for certain screen sizes using column-based media query support.
The Blazor Gantt Chart ensures that every cell is accessible using the keyboard. Major features like sorting, selection, and editing can be performed using keyboard commands alone; no mouse interaction required. This helps in creating highly accessible applications using this component.
The Blazor Gantt Chart has complete WAI-ARIA accessibility support. The Gantt Chart UI includes high-contrast visual elements, helping visually impaired people have the best viewing experience. Also, the valid UI descriptions are easily accessible through assistive technologies such as screen readers.
The Blazor Gantt Chart enables users from different locales to use it by formatting the date, currency, and numbering to suit local preferences. It uses the internalization (i18n) library to handle value formatting.
Users can localize all the strings used in the user interface of the Blazor Gantt Chart control. It uses the localization (l10n) library to localize UI strings.
Learn More about Blazor Gantt Chart
Download Free Trial
Pricing
Documentation
Online Examples
Watch a How-to Video
Community Forums
Suggest a feature
Syncfusion's Blazor components library offers over 70 UI components to work with Blazor server-side and client-side (Blazor WebAssembly) projects seamlessly. In addition to Gantt Chart, we provide popular Blazor components such as DataGrid, Charts, Scheduler, Diagram, and Word Processor.
Founded in 2001 and headquartered in Research Triangle Park, N.C., Syncfusion has more than 23,000+ customers and more than 1 million users, including large financial institutions, Fortune 500 companies, and global IT consultancies.
Today, we provide 1600+ controls and frameworks for web (Blazor, ASP.NET Core, ASP.NET MVC, ASP.NET WebForms, JavaScript, Angular, React, Vue, and Flutter), mobile (Xamarin, Flutter, UWP, and JavaScript), and desktop development (Windows Forms, WPF, WinUI(Preview) and UWP). We provide ready-to-deploy enterprise software for dashboards, reports, data integration, and big data processing. Many customers have saved millions in licensing fees by deploying our software.
sales@syncfusion.com | www.syncfusion.com | 1-888-9 DOTNET