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 & milestone	Base 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 & milestone	Extended 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

Flag	One 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.

Point	One 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.

Constraint	Task 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

Mark	One 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 calendar	Gantt 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

Dependencies	Lines 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 line	Vertical 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 line	Vertical 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.

Header	One 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.

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

Global calendar	Gantt 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

Resources	Information 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 path	Gantt 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 tasks	Gantt 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.

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

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

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

Display settings

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.
Order for export is defined by GanttExportOrder.
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 are	Main, 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 or Container.
	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.
	Container (new 16.0) for containers with Run boxes. Every Run container can be used as one Gantt task. It should not be set with Run.

It replaces deleted GanttObject and GanttDependencyObjects attribute.
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.
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.
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:
It ignores:
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.
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.
If the cell horizontal border is shown also in Gantt chart. Only if the Grid CSS style defines it.
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.
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.
Since 15.1 If set to 2 it works like 1 but does not render backgrounds in <svg>.
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.
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.
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.
Since 16.0 if set 3.bit (&4), it does not show the vertical lines in this grid, but still shows the lines in other grids when dragging run between grids.
The line is not shown if set <Cfg ShowDrag='0'/>.
If and how there will be shown tip for actual position when dragging Gantt object. Bit array.

1. bit	&1	There will be shown start date when moving GanttRun. Only for move, not for slide.
2-3. bit	&6	There 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	&24	There will be shown (8) edge date (start or end) or (16) duration or (24) both for resizing any Gantt run box.

Date format to display start and end of the Gantt item in GanttDragTip.
It is the same format as for Date type.
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.
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.
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.
Only for touch screens. <Cfg> attribute!
If set to 1, it permits dragging only focused object (row, image, Gantt bar, Gantt icon or Gantt line). It affects also link navigation.
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.
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.
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

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.

All	All Gantt items are editable / movable.
Main	Main 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), ManResizeLeft (new 15.1, resize only start), ManResizeRight (new 15.1, resize only end), 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).
Run	Run 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.
Flags	Flags 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).
Dependency	Dependency 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.
Resources	Resources 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.
Called to get the GanttEdit value for given cell dynamically. Return new edit string. 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);
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.
If the Gantt items under mouse cursor will be highlighted.
0 - never, 1 - only when it is editable / movable, 2 - always
Deletes all Gantt items from the actual or focused Gantt cell, including all dependencies.