Gantt objects

TreeGrid documentation

The Gantt chart can be added to grid by defining column of type Gantt (<C Type='Gantt' ... />) and setting the other Gantt chart attributes.
The grid with Gantt column still supports all other functionality like normal grid (sorting, filtering, grouping, search, calculations, ...).
The Gantt chart is automatically created from the given values and is also automatically recalculated whenever some source value is changed.
The Gantt chart is also interactive, so a user can change the Gantt chart by mouse and it automatically updates the source data.
The Gantt chart sources are usually other columns where are stored the source data in cells. These cells can be also edited by a user and Gantt chart is automatically updated.
Predefined settings for Gantt column is in default column <D Name='Gantt'/>, defined in Defaults.xml.

Gantt objects list

The Gantt chart can show various objects, possibly all together in one cell:

Gantt bars

Resizable, movable, support dependencies, resources and percentage completion
Used as sources for Gantt chart calculations (e.g. correcting dependencies or calculate critical path)

Main bar & milestoneBase Gantt chart task.
One or more independent bars with different color, class, caption, tooltip and unique id. Supports also milestones.
Defined by GanttStart (start date) and GanttEnd (due date) or by GanttStart (start date) and GanttDuration (length) as one continuous bar. Or defined by GanttParts as more discrete bars.
Supports more tasks (plans) in one cell, the count of the plans is defined by GanttCount. The plans are independent, can have their own dependencies, resources or percentage completion. Every task in individual plan can be discrete or continuous.

Run bar & milestoneExtended Gantt chart task or more independent tasks in one cell.
One or more independent bars with different color, class, caption, tooltip and unique id. Supports also milestones.
It supports also many options for moving and resizing the boxes.
Defined by GanttRun and optionally GanttRunStart. Or can be defined as summary of child main bars, see Editable Summary Run.
Can be used as complex planned task or more independent planned tasks.
Or can be used to define PERT chart.
Or it can be used for any other interactive bar chart.

Gantt icons

Not resizable, but movable objects

FlagOne or more icons in the cell, on specified dates, with defined side text or tooltip. Supports custom icons and their changing.
Usually used to attach some information and icon to selected date(s).
Defined by GanttFlags.
Does not> affect any Gantt calculations, except width of the Gantt column.

PointOne or more different movable bullets. With different icons, tooltip and edit permissions.
Used usually in math charts to display various points on specified positions.
Defined by GanttPoints.
Does not> affect any Gantt calculations, except width of the Gantt column.

ConstraintTask constraints, specify limits where the Gantt bars (and optionally Gantt icons) can be moved or resized, used also for Gantt calculations.
Four different constraints: early start (GanttMinStart), late start (GanttMaxStart), early end (GanttMinEnd) and late end (GanttMaxEnd).

Static objects

Not movable, not resizable, completely inactive

MarkOne or more dates or date ranges to highlight them. Can be different in every row and also input by a user.
Defined by GanttMark.

Availability (Chart)Availability or resource usage chart.
Defined by GanttAvailability.

Local calendarGantt calendar - excluded dates (holidays). Marks these dates by different color.
It is used in all Gantt calculations and is also possible to restrict start / end Gantt objects in these ranges.
Defined by GanttCalendar.

Global objects

Objects defined for the whole chart or between cells

DependenciesLines between two Gantt bars (Main or Run bars or their milestones). Even between different bars in one cell.
The dependencies set relation between the tasks and are used in Gantt chart calculation (e.g. correcting dependencies or calculate critical path)
The dependencies support edge type (ss,sf,fs,ff), lag and float.
The dependencies can be added, deleted and changed dynamically by mouse or keyboard.
Defined by GanttDescendants and / or GanttAncestors.

Start lineVertical line through all cells that specifies start of the whole project. It can be set, deleted or moved.
It is used in Gantt calculations, when correcting dependencies. It can work also as constraint.
Defined by GanttBase.

Finish lineVertical line through all cells that specifies end of the whole project. It can be set, deleted or moved.
It is used in Gantt calculations, when correcting critical path. It can work also as constraint.
Defined by GanttFinish.

HeaderOne or more Gantt header (up to 5), can be placed above or below (or both) the Gantt chart in fixed rows.
Shows the individual dates in given format or numbers in math chart.
Defined by GanttHeader1 - GanttHeader5.

BackgroundBackground lines or rectangles vertically through all cells to mark and highlight some dates or date ranges in the chart.
Defined by GanttBackground.

Global calendarGantt calendar - excluded dates (holidays). Marks these dates by different color. The dates can be also hidden from the chart.
It is used in all Gantt calculations and is also possible to restrict start / end Gantt objects in these ranges.
Defined by GanttExclude.

Features

They are not visible objects, they are listed here just for completion

ResourcesInformation assigned to any Gantt bar (Main or Run bar or milestone).
Used for calculating task prices and Availability chart.
It is possible also to display resources chart as inner text, side text or tooltip for Gantt bar.
Defined by GanttResources.

Critical pathGantt chart can calculate slack value for all tasks and mark tasks on or beyond critical path.
The Gantt bar on critical path is highlighted.
Defined by GanttSlack.

Summary tasksGantt chart can show various summary tasks calculated from their children.
The can be movable, resizable and with dependencies.
Defined by GanttSummary as Main bar or GanttRunSummary as Run bar.

ZoomZoom levels, possible from milliseconds to years. Smooth zoom available. Zooming by mouse dragging or clicking to date.
Defined by GanttZoom.

MenuPopup menu for the Gantt cell with items available for the clicked Gantt object.
Defined by GanttMenu.

APIGantt supports also various API methods and events to control end extend the Gantt chart from JavaScript.

Display settings

new 6.3 upd 10.0 <C> string

GanttOrder

["Chart,Availability,Constraints,Run,Main,Mark,Dependency,Flags,Points"]
Comma separated list of all Gantt objects to render, case insensitive.
The order of rendering the Gantt objects. The objects rendered later will overlay the previous objects in the same place.
The not listed Gantt objects are never rendered.
It affects also accessibility (interactivity) of the objects, they are accessible in reversed order.
Since 10.0 it can contain also the next main bars keywords Main1, Main2, Main3, ..., Main10. If missing, these keywords are automatically added after Main keyword if increased GanttCount.
new 10.0 <C> string

GanttTask

["Main"]
List of Gantt bars used as Gantt tasks, comma separated, case insensitive.
The Gantt tasks can have assigned dependencies and resources, can have percentage completion, can be disabled or locked and can have manual constraint.
Permitted objects areMain, Main1, Main2,... MainX for individual main bar plans. The whole main bar in one plan (not its individual Parts) is used as Gantt task.
All for all main bar plans.
Run for whole run bars. The whole Run is used as Gantt task. It should not be set with Box.
Box for individual Run boxes. Every Run box can be used as one Gantt task. The box must have set Id attribute to have assigned dependencies. It should not be set with Run.
It replaces deleted GanttObject and GanttDependencyObjects attribute.
new 10.0 API method void

SetGanttTask

(string value, string col = null)
Changes GanttTask value by JavaScript. Requires next RefreshGantt ( ) call.
value is new value to set to GanttTask, col is Gantt column or null for the first Gantt column in grid.
new 6.4 deleted 10.0 <C> string

GanttObject

["Main"]
Replaced by GanttTask.
Since 10.0 the dependencies and resources can be assigned to all Gantt tasks, not only to the first one in the cell.
new 10.0 chg 13.0 <C> int

GanttBottom

[css]
If set to some number (including 0), it updates row height to show all Gantt objects fully plus given pixels.
Since 13.0 if not set (default setting, changed from value 4 in 13.0) it is read from actual CSS style.
It is space in pixels reserved below Gantt objects.
It changes row Height attribute value. The calculated height cannot be less than minimal row height and higher than row MaxHeight.
It calculates the row height from:
Main bar or Run bar if it uses default height and position or if uses explicitly set height and position.
Main milestone and Run milestone position and default milestone height. See GanttIconBottom.
Run bar placed by OnGetGanttRunRect.
Overlaid Run bar if it is shifted by GanttRunErrorsShift.
Flag, Point or Constraint position and default object height. See GanttIconBottom.
It ignores:
If the Run or Main bar height is higher than default box height due its html content
The Main and Run bar side html
Set it to empty string to not update row height according to the Gantt objects height and position.
Incompatible with RowSpan for the Gantt cell.
new 10.0 chg 13.0 <C> int

GanttIconBottom

[css]
If it is not empty string, it is used instead of GanttBottom for Gantt icons (Flag, Point, Constraint).
Since 13.0 if not set (default setting, changed from value 0 in 13.0) it is read from actual CSS style.
It is used only if set GanttBottom.
new 13.2 <C> bool

GanttPagingUpdateHeight

[1]
If the row height is updated for GanttBottom even if the run boxes are outside Gantt page (for GanttPaging).
It is applied only for run boxes, for other Gantt objects is the height updated always.
new 9.3 chg 13.0 <C> bool

GanttTextOverlay

[0]
For 0 it always shows all texts in Gantt through other objects (e.g. images or bar backgrounds).
For 1 it overlays the texts like any other Gantt objects by the next objects in the GanttOrder. It can slow down bigger Gantt charts!
Since 13.0 If set to 1 it also renders background in <svg> to speed up the rendering.
Therefore the value 1 speeds grid with custom row calendars and / or with many colored exclude or background units. But slows down Gantt with many main parts or run boxes per row.
new 10.0 <C> string[*]

GanttHoverIcons

A list of icons for hovering custom icons in Gantt chart - Main and Run milestones and stops, Flags, Points, Constraints
It is first character separated array of string pairs, the first string is replaced by the second string.
If more strings match the search, only the first string is replaced.
For example "|Test.gif|TestH.gif|.gif|Hover.gif" replaces Test.gif by TestH.gif and Custom.gif by CustomHover.gif.
new 10.0 upd 11.0 <C> int

GanttDragLine

[1]
If there will be shown vertical line(s) when dragging Gantt object to better see the destination dates.
0 - no, 1 yes, but run only for slide, 2 yes, also on run move, left edge only, 3 (new 11.0) , yes, also on run move on both sides.
The line is not shown if set <Cfg ShowDrag='0'/>.
new 11.0 <C> int

GanttDragTip

[0]
If and how there will be shown tip for actual position when dragging Gantt object. Bit array.
1. bit&1There will be shown start date when moving GanttRun. Only for move, not for slide.
2-3. bit&6There will be shown (2) start date or (4) end date or (6) both for moving any Gantt object. For moving icons and lines there is shown always only start date.
4-5. bit&24There will be shown (8) edge date (start or end) or (16) duration or (24) both for resizing any Gantt run box.

new 11.0 <C> string

GanttDragTipDateFormat

[ ]
Date format to display start and end of the Gantt item in GanttDragTip.
It is the same format as for Date type.
new 11.0 <C> string

GanttDragTipDurationFormat

[ ]
Number format to display duration of the Gantt item in GanttDragTip, the duration is shown in GanttDataUnits.
It is the same format as for Float type.
new 11.0 API event string

OnGanttDragTip

(TGrid grid, TRow row, string col, string tip, object XY, int dir, int start, int end, int duration, int x, int y)
Called to get a tip text for Gantt object to display it on dragging like GanttDragTip.
tip is the default tip text, return it or new tip.
XY are Gantt objects under mouse cursor on dragging start returned by GetGanttXY.
start is actual start date in ms, end is actual end date in ms, duration is actual duration in ms. end and duration is null for GanttRun move.
dir is action: 1 resize left edge, 2 resize right edge, 3 move.
x is actual position in Gantt in pixels, y is vertical position in pixels. x and y is set for GanttRun move only.
new 10.0 <C> int[3]

GanttShift

[3]
How will be shifted Gantt icon in case two same icons are on the same place or too near.
It can contains one or three values, comma separated as [shiftX,shiftY,overX], e.g. GanttShift="0,3,5" or GanttShift="2".
shiftX - how much pixels will be shifted the next overlaid icon horizontally. It shifts the icons up to shiftX pixels distant.
shiftY - how much pixels will be shifted the next overlaid icon vertically. It shifts the icons up to overX pixels distant.
Affects Milestone (Main, Run), Flags, Points. For Run it works only if all the milestones are on the same vertical level. For Main it works only if the Parts are sorted by date.
new 10.0 <Cfg> int

TouchDragFocused

[2]
Only for touch screens. <Cfg> attribute!
If set to 1, it permits dragging only focused object (row, Gantt bar, Gantt icon or Gantt line).
If set to 2, permits dragging focused cell, not only focused row. Gantt is the same as for 1.
First tap on the object to focus it and next touch and move or resize it.
Similarly tap to empty space in Gantt chart and next touch and drag to create new bar.
It affects also showing Gantt menu - tap on the Gantt object and tap on it again to show the popup GanttMenu.
new 12.0 chg 12.1 <Cfg> int

TouchDragFocusedDependency

[2]
Only for touch screens. <Cfg> attribute!
If set to 1, it permits dragging dependency only from focused cell.
If set to 2, it permits dragging dependency only from focused Gantt bar or milestone.
First tap on the cell or object to focus it and next touch and move to create the dependency.
Since 12.1 the default value changed from 0 to 2.
new 10.0 <Cfg> int

TouchClearFocused

[0]
Only for touch screens. <Cfg> attribute!
Time in milliseconds; after that time the focus from actually focused cell or Gantt object is cleared.
0 means never.

Edit settings

renamed 10.0 upd 13.0 <C> <cell> string[ ]

GanttEdit

["all"]
Which Gantt objects can be edited / moved / changed / deleted / added by user. Comma separated list of flag names, case insensitive.
It does not affect editing values in the source cells - use standard attributes like CanEdit to restrict source cell editing.

AllAll Gantt items are editable / movable.
MainMain bars and milestones can be created, deleted and modified directly in Gantt chart.
(new 10.0) Individual actions can be set by MainMove, MainResize (resize+split), MainNew (add+delete), MainComplete, MainText, MainState (disable, lock), MainCorrect (schedule).
MainX(new 10.0) It can contain also the Main1, Main2, Main3, ... MainX.
The individual actions can be set by MainXMove, MainXResize (resize+split), MainXNew (add+delete), MainXComplete, MainXText, MainXState (disable, lock), MainXCorrect (schedule).
RunRun bars can be created, deleted and modified directly in Gantt chart.
(new 10.0) Individual actions for whole run can be set by RunMove (move+join), RunResize (resize+split), RunNew (add+delete), RunComplete, RunText (run text, type, tip, class), RunState (disable, lock, select), RunCorrect (schedule)
(new 13.0) Action for run container can be set by RunContainer
The Run can be more controlled by its attributes for moving and resizing.
FlagsFlags can be created, deleted, moved and modified directly in Gantt chart. Since 10.0 individual actions can be set by FlagsMove, FlagsNew (add+delete), FlagsText (text+icon change).
Points(new 6.4) Points can be created, deleted, moved and modified directly in Gantt chart. Since 10.0 individual actions can be set by PointsMove, PointsNew (add+delete).
Constraints(new 6.3) Constraints can be created, deleted and moved directly in Gantt chart. Since 10.0 individual actions can be set by ConstraintsMove, ConstraintsNew (add+delete).
DependencyDependency lines can be created, deleted or corrected directly in Gantt chart.
(new 10.0) Individual actions can be set by DependencyNew (create+delete), DependencyCorrect (moving related tasks, can be set individually also by MainCorrect, MainXCorrect and RunCorrect).
DependencyTypes(new 6.3) Dependency type can be set by dragging to different bar edge (ss,sf,fs,ff). It does not hover the dependency as editable.
DependencyLags(new 6.3) Dependency lag can be changed from menu. If set, dependency is hovered as editable, even if no other Dependency edit flag is set.
ResourcesResources can be assigned or entered directly in Gantt chart.
CriticalPath(new 11.0) Provides slack and critical path calculation even for not editable chart. It is set also when <Cfg Editing="0"/>.

For example GanttEdit="Main,Main1Move,Main1Resize,Main2Move,Main2Complete,Run,FlagsMove,Constraints"

More control can be done by assigning actions to events. The default actions are attached in Defaults.xml:
OnDragGantt="ResizeGanttMain OR MoveGanttMainFirst OR ResizeGanttRun OR MoveGanttRun OR MoveGanttFlag OR MoveGanttPoint OR MoveGanttConstraint OR MoveGanttBase OR MoveGanttFinish OR CreateGanttBar OR DragGanttDependency"
To attach special set of actions to inividual Gantt cell, define <I ... xxxOnDragGantt="....,1" ... />, where the xxx is name of your Gantt column. See ",1", it ensures to not run the default actions from Defaults.xml.
For example <I ... GANTTOnDrag="MoveGanttMain OR MoveGanttConstraint OR MoveGanttBase OR MoveGanttFinish OR DragGanttDependency"/>,
permits only moving specified objects, but restricts resizing, deleting and creating new objects.
Remember, you can use Default rows <D> to assign the same actions to more cells at once.

Use also OnCheckGantt event to control changes done by direct editing in source cells.
Use also GanttMenu to specify popup Gantt menu items for given cell.
new 6.3 upd 7.0 <C> int

GanttCheck

[4]
Check if Gantt source cell change by a user edit is correct.
0 - do nothing
1 - restrict incorrect changes
2 - alert warning and restrict incorrect changes
3 - (new 7.0) automatically correct incorrect values
4 - (new 7.0) alert warning and correct incorrect values
It checks all dates to be within constraints, circular dependencies, percentage complete, negative duration, End>Start
To set value to Gantt source cell by API use: val = grid.CheckGantt(row,col,val); if(val!==false) grid.SetValue(row,col,val,1);
new 7.0 <C> int

GanttCheckTime

[1000]
Time in milliseconds, how long will be displayed alert message for GanttCheck = '2' and '4'.
If set to 0, the message will be shown forever with OK button.
If set to 1, standard browser alert will be shown.
If set to negative number, the message will be shown for the (positive) time, but with OK button.
renamed 6.0 <C> <cell> int

GanttHover

[1]
If the Gantt items under mouse cursor will be highlighted.
0 - never, 1 - only when it is editable / movable, 2 - always
<Actions>

DeleteGanttAll ...F

Not attached to any event
Deletes all Gantt items from the actual or focused Gantt cell, including all dependencies.