Siticone Gantt Chart

The SiticoneGanttChart is a powerful project management visualization tool. It displays tasks on a timeline, allowing users to track project progress, dependencies, and schedules. It features automatic weekend highlighting, progress bars, and extensive styling options.

Data Binding

To render the Gantt Chart, you must map the control properties to your data source fields representing the task name, start date, end date, and completion status.

Property	Type	Description & Usage Example
`DataSource`	object	chart.DataSource = myTasksList; The source of the project data. Accepts `DataTable`, `List<T>`, or `IEnumerable`.
`TaskNameMember`	string	chart.TaskNameMember = "Title"; The property name for the task label displayed in the left column.
`StartDateMember`	string	chart.StartDateMember = "Start"; The property name for the task's start date (DateTime).
`EndDateMember`	string	chart.EndDateMember = "Deadline"; The property name for the task's end date (DateTime).
`ProgressMember`	string	chart.ProgressMember = "PercentComplete"; Optional. The property name for task completion (0.0 to 1.0 or 0 to 100).

Appearance & Theming

Customize the timeline look, including headers, task bars, and grid lines.

Property	Type	Description & Usage Example
`Theme`	GanttThemePreset	chart.Theme = GanttThemePreset.ModernGreen; Applies a preset color scheme. Options include `ClassicBlue`, `ModernGreen`, `ProfessionalGray`, etc.
`TaskBarColor`	Color	chart.TaskBarColor = Color.LightBlue; The base color of the task bars.
`TaskProgressColor`	Color	chart.TaskProgressColor = Color.DarkBlue; The color representing the completed portion of the task.
`HeaderBackColor`	Color	chart.HeaderBackColor = Color.WhiteSmoke; The background color of the top timeline header (months/days).
`WeekendColumnColor`	Color	chart.WeekendColumnColor = Color.FromArgb(240, 240, 240); The background color used to highlight Saturday and Sunday columns.
`TaskNameColumnWidth`	int	chart.TaskNameColumnWidth = 200; The width (in pixels) of the left column displaying task names.
`RowHeight`	int	chart.RowHeight = 35; The height (in pixels) of each task row.

Behavior & Interaction

Control animations and interactive feedback for the user.

Property	Type	Description & Usage Example
`EnableAnimations`	bool	chart.EnableAnimations = true; If true, task bars will animate horizontally (grow) when data is loaded.
`EnableHighlight`	bool	chart.EnableHighlight = true; Highlights the task bar under the mouse cursor by brightening its color.
`EnableTooltips`	bool	chart.EnableTooltips = true; Shows a tooltip with the Task Name, Start Date, End Date, and Progress on hover.

Public Methods

DataBind()

// Forces the chart to process the DataSource and render the timeline.
// Call this after changing data or member mappings.
ganttChart.DataBind();

Events

Respond to user interaction with tasks.

Event Descriptions & Wiring

// 1. TaskClick Event
// Fires when a user clicks on a task bar.
chart.TaskClick += (s, e) => 
{
                MessageBox.Show($"Task: {e.TaskName}\nProgress: {e.Progress:P0}");
};

// 2. TaskHover Event
// Fires when the mouse enters a task bar.
chart.TaskHover += (s, e) => 
{
    lblStatus.Text = $"Due Date: {e.EndDate:d}";
};

// 3. DataLoaded Event
// Fires after data processing is complete.
chart.DataLoaded += (s, e) => 
{
                Console.WriteLine($"Project Timeline: {e.MinDate:d} to {e.MaxDate:d}");
};

Detailed Usage Examples

Example 1: Project Schedule (DataTable)

Visualizing a software development lifecycle.

C# - Project Schedule

private void LoadProjectSchedule()
{
                DataTable dt = new DataTable();
    dt.Columns.Add("Title", typeof(string));
    dt.Columns.Add("Start", typeof(DateTime));
    dt.Columns.Add("End", typeof(DateTime));
    dt.Columns.Add("Percent", typeof(double));

    dt.Rows.Add("Planning", DateTime.Today, DateTime.Today.AddDays(5), 1.0);
    dt.Rows.Add("Design", DateTime.Today.AddDays(6), DateTime.Today.AddDays(12), 0.6);
    dt.Rows.Add("Development", DateTime.Today.AddDays(13), DateTime.Today.AddDays(25), 0.2);

    ganttChart.DataSource = dt;
    ganttChart.TaskNameMember = "Title";
    ganttChart.StartDateMember = "Start";
    ganttChart.EndDateMember = "End";
    ganttChart.ProgressMember = "Percent";
    
                // Styling
    ganttChart.Theme = GanttThemePreset.ProfessionalGray;
    ganttChart.TaskNameColumnWidth = 120;
    
    ganttChart.DataBind();
}

Example 2: Event Planning (List of Objects)

Managing tasks for an event using a custom class.

C# - Event Tasks

public class EventTask
{
                public string Name { get; set; }
                public DateTime Start { get; set; }
                public DateTime Due { get; set; }
                public double Status { get; set; } // 0-100
}

private void LoadEventTasks()
{
                var tasks = new List<EventTask>
    {
                new EventTask { Name = "Venue Booking", Start = DateTime.Now, Due = DateTime.Now.AddDays(3), Status = 100 },
                new EventTask { Name = "Catering", Start = DateTime.Now.AddDays(2), Due = DateTime.Now.AddDays(5), Status = 50 },
                new EventTask { Name = "Invitations", Start = DateTime.Now.AddDays(4), Due = DateTime.Now.AddDays(10), Status = 0 }
    };

    ganttChart.DataSource = tasks;
    ganttChart.TaskNameMember = "Name";
    ganttChart.StartDateMember = "Start";
    ganttChart.EndDateMember = "Due";
    ganttChart.ProgressMember = "Status";
    
                // Custom Green Theme
    ganttChart.Theme = GanttThemePreset.ModernGreen;
    ganttChart.DataBind();
}

Enumerations

GanttThemePreset Enum

public enum GanttThemePreset
{
    Custom, 
    ClassicBlue, 
    ModernGreen, 
    ProfessionalGray, 
    VibrantPurple, 
    Corporate, 
    Sunrise,
                // ... and many more
}