Project Name

Visualize and manage your project timeline

No file chosen

v1.2.0

SG Gantt Chart - User Guide

Introduction

Welcome to the SG Gantt Chart application! This guide will help you get started with creating and managing your project schedules using Gantt charts. Work is organised the same way as in Jira: Epics contain Tasks, and tasks can contain Subtasks.

Creating a Chart

To create a new chart:

Click "Add Epic" to create a top-level group of work (e.g., a feature or milestone).
Select the epic and click "Add Task" to add work inside it — or simply right-click the epic and choose "Add Task to this Epic".
Select a task and click "Add Subtask" (or right-click the task) to break it down further.
Fill in details such as Name, Start and Finish dates, then click Add.

Tip: Right-clicking any row shows a menu with the actions available for that item (add, edit, delete). Epics and tasks automatically roll up the dates and progress of the items inside them.

Task Fields Explained

Type: Epic (purple), Task (blue) or Subtask (teal) — shown as an icon next to each name. The type is set when the item is created.
ID: A unique identifier, assigned automatically. IDs cannot be edited, so links between tasks (predecessors) always stay intact.
Name: The name of the task.
Start: The start date of the task.
Finish: The end date of the task.
% Complete: The progress percentage of the task.
Predecessors: The IDs of tasks that must be completed before this task can start.
Resource Names: Names of resources assigned to the task.
Notes: Any additional information about the task.

Using Predecessors to Link Tasks

Predecessors allow you to define dependencies between tasks. To link tasks:

When adding or editing a task, locate the "Predecessors" field.
Enter the ID of the predecessor task, followed by the dependency type (optional). For example:
- 3FS - Task 3 must finish before this task starts (Finish-to-Start).
- 5SS - Task 5 and this task start together (Start-to-Start).
- 7FF - This task cannot finish until Task 7 finishes (Finish-to-Finish).
- 2SF - This task cannot finish until Task 2 starts (Start-to-Finish).
You can specify multiple predecessors by separating them with commas: 3FS,5SS.

Note: If no dependency type is specified, FS (Finish-to-Start) is assumed by default.

Tip: You can also create Finish-to-Start links with the mouse - hover over a task bar and drag the small circle at its end onto another task bar. See "Editing Directly on the Chart" below.

Hierarchy: Epics, Tasks and Subtasks

Work is organised in three levels, just like Jira:

Epic (purple bolt): a large piece of work, phase or feature. Created with the "Add Epic" button.
Task (blue check): a piece of work inside an epic. Select an epic (or right-click it) and choose "Add Task".
Subtask (teal squares): a smaller step inside a task. Select a task (or right-click it) and choose "Add Subtask".

Epics and tasks automatically take their dates and progress from the items inside them. You can collapse or expand them by clicking the "+" or "–" symbols next to their names.

Project Name

The project name helps you identify and manage different Gantt charts. Here's how to use this feature:

When you import a CSV file, the project name automatically changes to match the file name (without the extension).
The project name is displayed at the top center of the page.
To edit the project name:
- Double-click on the project name at the top of the page.
- Enter a new name in the popup that appears.
- Click "Apply" to save the new name or "Cancel" to keep the current name.
When exporting your chart, the project name is used as the file name for the exported CSV.
If no project name is set, the default name "Project Name" is used.

Note: The project name cannot be empty. You will be prompted to enter a name if you try to save an empty project name.

Importing and Exporting Data

Importing CSV Files

You can import tasks from a CSV file:

Prepare your CSV file with the following headers: Outline Level, ID, Name, Start, Finish, % Complete, Predecessors, Resource Names, Notes.
Click on the "Choose File" button and select your CSV file.
The chart will update to display the tasks from your file.

Note: When importing, any dependency types or lags in the Predecessors field will be removed, leaving only the task IDs.

Exporting to CSV

To export your tasks to a CSV file:

Click on the "Export" button.
A CSV file named according to your project name will be downloaded containing your current tasks.

Note: When exporting, the Predecessors field will include the default dependency type FS (Finish-to-Start) for each predecessor.

Additional Features

Zoom In and Out

Use the "Zoom In" and "Zoom Out" buttons to adjust the time scale of your Gantt chart.

Collapse and Expand All Tasks

You can collapse or expand all tasks using the "Collapse All" and "Expand All" buttons.

Resource Filter

Use the resource filter dropdown to view tasks assigned to a specific resource. Select "All" to view all tasks.

Editing Directly on the Chart

The quickest way to adjust your schedule is to drag the task bars themselves:

Move a task: Click and hold the middle of a task bar, then drag it left or right. The start and finish dates shift together, keeping the duration the same. Dragging an epic or summary bar moves everything inside it.
Change the duration: Hover over the left or right edge of a task bar until the cursor changes to a resize arrow, then drag the edge to bring the start date forward or push the finish date out. Epic and summary bars can be resized the same way - they can be extended beyond the tasks inside them, but their edges stop at the earliest start and latest finish of those tasks.
Link two tasks: Hover over a task bar and a small circle appears just after it. Drag the circle onto another task bar and release to create a Finish-to-Start link (the bar you dragged from becomes the predecessor). Valid targets are highlighted in green while you drag.

While you drag, a small label next to the cursor shows the new dates, and bars snap to whole days. Press Esc during a drag to cancel it. All drag changes appear in the task's Edit Task form (Start, Finish and Predecessors fields) and are included when you save the project.

Note: When Auto-schedule is on, dragging a task also shifts its dependent tasks, and creating a link pulls the successor forward so it starts the day after its predecessor finishes. Links that would create a circular dependency (or link a task to its own epic) are not allowed, so those bars simply won't highlight as targets. Milestones (diamonds) can be moved and linked but not resized. Epic and summary bars can never shrink past the items inside them - those items always push the epic's dates outward.

Editing and Deleting Tasks

To edit a task:

Double-click on the task name or task bar in the chart area.
Make the necessary changes in the popup form.
Click "Apply" to save the changes.

To delete a task:

In the edit task popup, click on the "Delete Task" button.
Confirm the deletion when prompted.

Notes Editor

You can add detailed notes to each task using the rich text editor:

In the task form, click on the "Edit Notes" button.
Use the toolbar to format your notes (bold, italic, underline, lists).
Click "Save" to apply the notes to the task.

Automatic Task Scheduling

SG Gantt Chart now supports automatic task scheduling based on dependencies:

When a predecessor task's end date changes, all dependent tasks will automatically shift accordingly (if "Auto-schedule" is checked).
The relationship between tasks is determined by the dependency type.
When creating a new task with a predecessor, dates will be automatically calculated based on the predecessor (if "Auto-schedule" is checked).
Task duration remains constant when dependencies cause a shift in dates.

Note: Circular dependencies are automatically detected and resolved to prevent infinite loops.

Support

For support or feedback, please contact me.

Credits

SG Gantt Chart was developed to provide a simple and efficient way to manage project schedules using Gantt charts.

Thank you for using SG Gantt Chart!