ItemBar class (Gantt)

ItemBar(oIB, oOptionsopt)

new ItemBar(oIB, oOptionsopt)

The ItemBar object holds information(options) about a bar within the control. The AddBar(name, start, end, [key, [text]]) method of the Item object creates and adds a new bar for the item. The ItemBar(key) method gets the bar of the current item giving its key, and returns an object of ItemBar type.

Every option of the ItemBarOptions type has associated a property of the ItemBar object. For instance, the option:

caption {string}, specifies the caption to display within the bar
is associated with the property:
Caption {string}, specifies the caption to display within the bar
which means that the following statements are equivalent:
oItemBar.Options = {caption: "pointer"}
oItemBar.SetOptions({caption: "pointer"})
oItemBar.Caption = "pointer"
oItemBar.SetCaption("pointer")
where oItemBar is an object of ItemBar type
Parameters:
Name Type Attributes Description
oIB ItemBars Indicates an object of ItemBars type that's the owner collection of this bar.
oOptions object <optional>
Specifies an object of ItemBarOptions type that holds information about the bar, such as name, shape and so on.

Members

AlignPercentCaption :number

The AlignPercentCaption property horizontally aligns the bar's percent-caption (Only bars of alignPercentCaption-type ("A%B") display and handle the inner progress-bar). The ShowPercentCaption property shows or hides the bar's percent-caption. The Percent property gets or sets the bar's percent as a value from 0(0%) to 1(100%).

The AlignPercentCaption property specifies the horizontal alignment of the bar's percent-caption, as one of the following value:

  • 0, 1 or 2 the caption is not clipped and it is aligned to the left, center or right side of the bar ( no clip )
  • 3, 4 or 5 the caption of the bar gets clipped to the bar's client area, else the caption is aligned to the left, center or right side of the bar ( clip, inside )
  • 6, 7 or 8 the bar's caption is hidden if its size is less or equal with MinUnitWidth property, else if it does not fit the bar's client are, gets clipped or else fully aligned to left, center or right side of the bar ( hide if min, clip if not fit, inside )
  • 9, 10 or 11 the bar's caption is hidden if it does not fit entirely into the bar's client area, else it is fully displayed aligned to the left, center or right side of the bar ( hide if not fit, no clip, inside )
  • 12, 13 or 14 the bar's caption is displayed inside of the bar's client area if it fits entirely, else it is displayed outside of the bar aligned to the left, center or right ( no clip, inside, outside )
  • 16, 17, 18, the bar's caption is displayed outside of the bar to the left or to the right ( no clip, outside )

By default, the percent-caption is 18, meaning that it is displayed outside of the bar to the right side.

Type:
  • number
Example
0 {boolean}, the bar's percent-caption is aligned to the left
18 {number} or null {null}, the bar's percent-caption is displayed right-outside
AlignPercentCaption

(readonly) Bar :Bar

The Bar property gets the gantt-bar associated with the current item-bar. The gantt-bar defines the visual-appearance and behavior of the item-bar. The Name property of the item-bar indicates the name of the gantt-bar to associate with the item-bar. You can use the Name property to change the type of the item-bar at runtime.
Type:
Example
The following statements are equivalents:

 oItemBar.GetBar(), gets the gantt-bar associated with the current item-bar
 oItemBar.Bar, gets the gantt-bar associated with the current item-bar

where oItemBar is an object of ItemBar type
Bar

CanBeLinked :boolean

The CanBeLinked property specifies whether the bar can be linked. The CanBeLinked property has effet only when user links the bars by drag and drop operation. The CanStartLink property specifies whether a link can start from this bar. The CanEndLink property specifies whether a link can end to this bar. The bar can be linked if both CanStartLink and CanEndLink properties are true. The CanBeLinked property is used to enable/disable both CanStartLink and CanEndLink properties. By default, the CanBeLinked property is true, which means that the bar can be linked.
Type:
  • boolean
Example
false {boolean}, no link can start from, or end into the current bar
true {boolean} or null {null}, the bar can be linked
CanBeLinked
The CanEndLink property specifies whether a link can end to this bar. The CanEndLink property has effet only when user links the bars by drag and drop operation. The CanStartLink property specifies whether a link can start from this bar. The CanEndLink property specifies whether a link can end to this bar. The bar can be linked if both CanStartLink and CanEndLink properties are true. The CanBeLinked property is used to enable/disable both CanStartLink and CanEndLink properties. By default, the CanEndLink property is true, which means that a link can end to this bar.
Type:
  • boolean
Example
false {boolean}, no link can end on this bar
true {boolean} or null {null}, any link can end on this bar
CanEndLink

CanMove :boolean

The CanMove property specifies whether the user can move the bar within the same item by drag (requires to be selectable too). The CanResize property specifies whether the item-bar can be resized by drag on both margins. The CanMoveToAnother property specifies whether the item-bar can be moved from an item to another by drag and drop. The Selectable property specifies whether the item-bar is selectable. By default, the item-bar can be moved within the same item but not from an item to another, while it is selectable.
Type:
  • boolean
Example
false {boolean}, the user can't move the item-bar
true {boolean} or null{null}, the user can move the item-bar by drag
CanMove

CanMoveToAnother :boolean

The CanMoveToAnother property specifies whether the bar can be moved to another item by drag and drop (requires to be selectable too). When using drag and drop to move the item-bar to another item, the target item must not include item-bars with the same key as the item-bar being moved. The key must be unique within the item. The CanResize property specifies whether the item-bar can be resized by drag on both margins. The CanMove property specifies whether the item-bar can be moved within the same item by drag. The Selectable property specifies whether the item-bar is selectable. By default, the item-bar can be moved within the same item but not from an item to another, while it is selectable.
Type:
  • boolean
Example
false {boolean} or null{null}, the user can't move the item-bar
true {boolean}, the user can move the item-bar from an item to another, by drag
CanMoveToAnother

CanResize :number

The CanResize property specifies whether the user can resize the bar on specifies whether the user can resize the bar on both margins by drag (requires to be selectable too). The CanMove property specifies whether the item-bar can be moved within the same item by drag. The CanMoveToAnother property specifies whether the item-bar can be moved from an item to another by drag and drop. The Selectable property specifies whether the item-bar is selectable. By default, the item-bar can be resized on both sides, can be moved within the same item but not from an item to another, while it is selectable. The CanResize property can be set to the following values:
  • 0 {number} or false {boolean}, the user can not resize the bar by drag
  • -1 {number} or null {null}, the bar can be resized on both sides
  • 1 {number} or true {boolean}, the bar can be resized on left side, and can not be resized on right
  • 2 {number}, the bar can be resized on right side, and can not be resized on left
Type:
  • number
Example
false {boolean}, the user can't resize the item-bar
true {boolean}, the user can resize the bar on left side, and can not be resize on right
-1 {number} or null {null}, the user can resize the bar on both sides
CanResize

CanResizePercent :boolean

The CanResizePercent property shows or hides the bar's percent-caption (Only bars of percent-type ("A%B") display and handle the inner progress-bar). The percent indicates the progress made within the bar's duration. The percent is a value between 0 and 1, where 0 means that no progress has been made, and 1 means that the bar's work is completed. The PercentCaptionFormat property specifies how the percent-caption is displayed. The ResizePercentStep property specifies the step to increase or decrease the percent when resizing the inner progress-bar with the mouse. The ShowPercentCaption property indicates whether the percent-caption is visible or hidden. By default, the user can resize the bar's percent at runtime.
Type:
  • boolean
Example
false {boolean}, the bar's percent can not be resized by drag
true {boolean} or null {null}, the user can resize the bar's percent at runtime
CanResizePercent
The CanStartLink property specifies whether a link can start from this bar. The CanStartLink property specifies whether a link can start from this bar. The CanEndLink property specifies whether a link can end to this bar. The bar can be linked if both CanStartLink and CanEndLink properties are true. The CanBeLinked property is used to enable/disable both CanStartLink and CanEndLink properties. By default, the CanStartLink property is true, which means that a link can start from this bar.
Type:
  • boolean
Example
false {boolean}, no link can start from the current bar
true {boolean} or null {null}, any link can start from the current bar
CanStartLink

Caption :string

The Caption property gets or sets the bar's caption. The ShowCaption property specifies whether the caption is displayed for the item-bar. The ToolTip property specifies the text displayed as a tooltip when the mouse pointer hovers over the item-bar. The CaptionHOffset property specifies the horizontal offset of the caption with respect to the item-bar. The CaptionVOffset property specifies the vertical offset of the caption with respect to the item-bar. The HAlignCaption property specifies the horizontal alignment of the caption with respect to the item-bar. The VAlignCaption property specifies the vertical alignment of the caption with respect to the item-bar.

The caption supports exHTML format, including the <%=formula%> tag, where formula is an expression that supports predefined constants, operators and % keywords such as %0 (itembar's property), %C0 (cell's value), %CD0 (cell's extra-data) or %CS0 (cell' checkbox-state)

The expression supports the following keywords:
%0, %1, %2, ... specifies the value/option of the item-bar as name, start, end and so on (ItemBarPropertyEnum type)
%C0, %C1, %C2, ... {string} specifies the caption of the cell, or the string the cell displays in the column with the index 0, 1 2, ... ( "%C0 + %C1", concatenates the caption of first and second cell )
%CD0, %CD1, %CD2, ... {any} specifies the cell's user-date in the column with the index 0, 1 2, ... ( "%CD0 ? value : ``", displays the cell's value only if the cell's data is not empty )
%CS0, %CS1, %CS2, ... {number} specifies the cell's state in the column with the index 0, 1 2, ... ( "(%CS0 ? `<b>` : ``) + value", displays the cell's value in bold only if the first cell is checked )
%CT0, %CT1, %CT2, ... {boolean} returns true if the cell displays a total field; otherwise, it returns false. The exTotalField / exTotalColumn flag specifies whether the cell displays a total field. For instance, "%CT1" refers to all cells in the second column that display totals, while "not %CT1" refers to all cells in the second column that do not display totals (@since 3.3)
%CE0, %CE1, %CE2, ... {boolean} returns true if the cell is editable; otherwise, it returns false.. For example, "%CE0" refers to all editable cells in the first column, while "not %CE1" refers to all cells in the second column that are read-only (@since 3.3)
%CC0, %CC1, %CC2, ... {number} retrieve the number of child items (this keyword consistently returns identical results for all cells since it pertains to the item that hosts each cell). The ChildCount property returns the number of child items. For example, "%CC0" identifies all parent items, while "%CC0 = 0" identifies all leaf items (@since 3.3)
%CX0, %CX1, %CX2, ... {boolean} returns true if the item hosting the cell is expanded, or false if it is collapsed (this keyword consistently returns identical results for all cells since it pertains to the item that hosts each cell). The Item.Expanded property specifically indicates whether the item is expanded or collapsed. For example, "%CX0" refers to all expanded items, while "not %CX0" identifies all collapsed items (@since 3.3)
Type:
  • string
Example
"&lt;b&gt;task&lt;/b&gt;" {string}, the item-bar displays the task string in bold
"&lt;fgcolor white&gt;&lt;bgcolor black&gt; &lt;%=%0%&gt; " {string}, the item-bar displays its type/name in black/white
"&lt;%=shortdate(%1)%&gt;&lt;br&gt;&lt;%=shortdate(%2)%&gt;" {string}, the item-bar displays its start date-time in short format on the first line, and the end date-time in short format, on the second line
"&lt;%=%C0 + %C1%&gt;" {string}, concatenates and displays the caption of first and second cell
"&lt;%=(%CD0 ? %0 : ``)%&gt;" {string}, displays the first-column only if the item's data is not empty
"&lt;b&gt;&lt;%=(%CS0 ? %0 : ``)%&gt;&lt;/b&gt;&lt;%=(%CS0 ? `` : %0)%&gt;" {string}, displays the item-bar's name in bold only if the first cell is checked )
Caption

CaptionHOffset :number

The CaptionHOffset property gets or sets the bar's caption horizontal-offset (relative to its alignment/default-position). The CaptionVOffset property defines the bar's caption vertical-offset (relative to its alignment/default-position). The Caption property defines the bar's caption text. The HAlignCaption property defines the bar's caption horizontal-alignment. The VAlignCaption property defines the bar's caption vertical-alignment. The ShowCaption property defines whether the bar's caption is visible. By default, the bar's caption is shown at its alignment/default-position.
Type:
  • number
Example
0 {number}, null {null}, the bar's caption is shown at its alignment/default-position
-4 {number}, the bar's caption is shown 4-pixels left to its alignment/default-position
4 {number}, the bar's caption is shown 4-pixels right to its alignment/default-position
CaptionHOffset

CaptionVOffset :number

The CaptionVOffset property gets or sets the bar's caption vertical-offset (relative to its alignment/default-position). The CaptionHOffset property defines the bar's caption horizontal-offset (relative to its alignment/default-position). The Caption property defines the bar's caption text. The HAlignCaption property defines the bar's caption horizontal-alignment. The VAlignCaption property defines the bar's caption vertical-alignment. The ShowCaption property defines whether the bar's caption is visible. By default, the bar's caption is shown at its alignment/default-position.
Type:
  • number
Example
0 {number}, null {null}, the bar's caption is shown at its alignment/default-position
-4 {number}, the bar's caption is shown 4-pixels up to its alignment/default-position
4 {number}, the bar's caption is shown 4-pixels down to its alignment/default-position
CaptionVOffset

(readonly) CriticalPath :number

The CriticalPath property indicates whether the current bar is part of the critical path (currently, the ItemBar.CriticalPath property specifies the position (1-based) of the bar in the critical path). The critical path is the sequence of project network activities which add up to the longest overall duration. This determines the shortest time possible to complete the project. Any delay of an activity on the critical path directly impacts the planned project completion date. The SchedulePDM method computes the critical path of the project. The criticalPathBarShape option specifies the shape of the critical-path bars. The CriticalPath property returns one of the following values:
  • 0, if the bar is not part of the critical path
  • the position (1-based) of the bar in the critical path (In other words the current bar is part of the critical path, if the ItemBar.CriticalPath property is not 0. Any positive value indicates the position of the current bar in the critical path)
Type:
  • number
Example
The following statements are equivalents:

 oItemBar.GetCriticalPath(), indicates whether the current bar is part of the critical path (currently, the ItemBar.CriticalPath property specifies the position (1-based) of the bar in the critical path)
 oItemBar.CriticalPath, indicates whether the current bar is part of the critical path (currently, the ItemBar.CriticalPath property specifies the position (1-based) of the bar in the critical path)

where oItemBar is an object of ItemBar type
CriticalPath

Duration :number

The Duration property gets or sets the item-bar's duration or length in days. The duration or length is computed as the difference between the item-bar's end and start margins. The Start and End properties specify the item-bar's start and end margins respectively. The Move method moves the item-bar by days. The Duration property specifes the item-bar's duration or length in days (or hours if including the decimal point, for instance 0.5 indicates a 12 hours lenght). The item-bar's start/end margins are computed as explained:
  • 0 {number}, specifies the zero-length, so the item-bar's end margins is set to start
  • positive {number}, the item-bar's end margins is set to start + duration
  • negative {number}, the item-bar's start margins is set to end + duration
Type:
  • number
Example
0 {number}, specifies the zero-length, so the item-bar's end margins is set to start
5 {number}, sets the item-bar's duration/length to 5 days
Duration

Effort :number|string

The Effort property gets or sets the bar's effort. The effort indicates the effort to execute an unit within the bar (bar's histogram value). The effort field could be a numeric value which it is applied for all units in the task (constant-effort), or a string that indicates the expression/formula to get the effort of the bar to be represented on the chart's histogram (variant-expression). By default, the effort is 1.

The Effort property could be:

  • a numeric value which it is applied for all units in the task (constant-effort)
  • a string that indicates the expression/formula to get the effort of the bar to be represented on the chart's histogram (variant-expression).

    The expression/formula may contain the following keywords:

    • value, {Date}indicates the date-time being queried
    • start, {Date} indicates the starting point of the bar as indicated by ItemBar.Start property
    • end, {Date} indicates the ending point of the bar as indicated by ItemBar.End property

    The HistogramUnitCount property gets or sets the time-scale count to determine the effort of bars with variable-effort. The HistogramUnitScale property defines the time-scale unit to determine the effort of bars with variable-effort. For instance, the ItemBar.Effort on "weekday(value) in (0,6) ? 0 : 2", means that that effort to do the job is 2 for any day in the task, excepts the Sundays(0) and Saturdays(6) (weekend. For instance, the "(hour(value) > 5 and hour(value) < 18) ? 2 : 0" indicates that the bar's effort is 2 for any hour between 6AM and 18PM, and 0 for rest.

Type:
  • number | string
Example
0 {number}, the bar is not represented into the control's histogram
 1.5 {number}, the bar's histogram value is based on the bar's histogramType option as explained:

   exHistOverload(0), adds 1.5-unit(s) to the histogram for each date-time of the bar
   exHistOverAllocation(1), adds 150% to the histogram for each date-time of the bar (1 day long), 75% for a 2-days long or shortly effort divided by length (in days) (effort/length)
   exHistOverAllocationFixed(512), adds 150% to the histogram for each date-time of the bar (no matter of its length) (fixed percent)
   exHistOverAllocationMultiply(1024), adds 150% to the histogram for each date-time of the bar (1 day long), 300% for a 2-days long or shortly effort multiplied by length (in days) (effort*length)

 "weekday(value) in (0,6) ? 0 : 2" {string}, defines an effort-expression or a variable-effort as explained: the effort to do the job is 2 for any day in the task, excepts the Sundays(0) and Saturdays(6) (weekend)
 "weekday(value) = 1 ? 2 : 1" {string}, indicates that the effort to do the job is 2 for Mondays(1), else 1
 "(month(value)=month(value+1)) ? 1 : 0" {string}, indicates that the effort to do the job is 1 for any day, excepts the last day in the month
 "int((value-start)/86400000) ? 1 : 2" {string},  indicates that the effort to do the job is 2 for the first day in the task, and 1 for the others (86400000 represents the number of mili-seconds within a day, as 24 * 60 * 60 * 1000)
 "(int((value-start)/86400000)+1) mod 2 ? 1 : 0" {string},  indicates that the effort to do the job is 2 for the first day in the task, and 1 for the others (86400000 represents the number of mili-seconds within a day, as 24 * 60 * 60 * 1000)
Effort

End :any

The End property gets or sets the date-time the bar ends to. The Start property gets or sets the date-time the bar starts from. The Duration property gets or sets the item-bar's duration in days (or hours if including the decimal point, for instance 0.5 indicates a 12 hours lenght). The Move method moves the item-bar by days(or hours if including the decimal point, for instance 0.5 moves by 12 hours). The onbarresize event is triggered when a user finishes dragging an item-bar to move or resize it. The onbarresizing event occurs while the user is resizing or moving an item-bar by drag. The End property can be set to one of the following:
  • value {null}, indicates the current date and time (equivalent of Now)
  • value {string}, defines the date in string-format as "#MM/DD/YYYY[ HH:mm:ss]#"
  • value {Date}, indicates a JavaScript date to be copied
  • value {number} integer value representing the year of the date to be created
Type:
  • any
Example
"#1/2/2001#" {string}, defines the bar's end date-time as January 2nd, 2001
Date.Today().NextDay(2) {Date}, changes the bar's end date-time to 1 day after tomorrow
End

ExtraCaption :string

The ExtraCaption property gets or sets the bar's extra caption. The Caption property gets or sets the bar's caption. The ShowExtraCaption property specifies whether the item-bar's extra caption is visible or hidden. ExtraCaptionHAlign property specifies the horizontal-alignment / clipping of the item-bar's extra caption inside / outside the bar. The ExtraCaptionVAlign property specifies the vertical-alignment of the item-bar's extra caption inside / outside the bar. The Caption property gets or sets the bar's caption. The ExtraCaptionHOffset property specifies the horizontal offset of the extra caption with respect to the item-bar. The ExtraCaptionVOffset property specifies the vertical offset of the extra caption with respect to the item-bar.

The extraCaption supports exHTML format, including the <%=formula%> tag, where formula is an expression that supports predefined constants, operators and % keywords such as %0 (itembar's property), %C0 (cell's value), %CD0 (cell's extra-data) or %CS0 (cell' checkbox-state).

The expression supports the following keywords:
%0, %1, %2, ... specifies the value/option of the item-bar as name, start, end and so on (ItemBarPropertyEnum type)
%C0, %C1, %C2, ... {string} specifies the caption of the cell, or the string the cell displays in the column with the index 0, 1 2, ... ( "%C0 + %C1", concatenates the caption of first and second cell )
%CD0, %CD1, %CD2, ... {any} specifies the cell's user-date in the column with the index 0, 1 2, ... ( "%CD0 ? value : ``", displays the cell's value only if the cell's data is not empty )
%CS0, %CS1, %CS2, ... {number} specifies the cell's state in the column with the index 0, 1 2, ... ( "(%CS0 ? `<b>` : ``) + value", displays the cell's value in bold only if the first cell is checked )
%CT0, %CT1, %CT2, ... {boolean} returns true if the cell displays a total field; otherwise, it returns false. The exTotalField / exTotalColumn flag specifies whether the cell displays a total field. For instance, "%CT1" refers to all cells in the second column that display totals, while "not %CT1" refers to all cells in the second column that do not display totals (@since 3.3)
%CE0, %CE1, %CE2, ... {boolean} returns true if the cell is editable; otherwise, it returns false.. For example, "%CE0" refers to all editable cells in the first column, while "not %CE1" refers to all cells in the second column that are read-only (@since 3.3)
%CC0, %CC1, %CC2, ... {number} retrieve the number of child items (this keyword consistently returns identical results for all cells since it pertains to the item that hosts each cell). The ChildCount property returns the number of child items. For example, "%CC0" identifies all parent items, while "%CC0 = 0" identifies all leaf items (@since 3.3)
%CX0, %CX1, %CX2, ... {boolean} returns true if the item hosting the cell is expanded, or false if it is collapsed (this keyword consistently returns identical results for all cells since it pertains to the item that hosts each cell). The Item.Expanded property specifically indicates whether the item is expanded or collapsed. For example, "%CX0" refers to all expanded items, while "not %CX0" identifies all collapsed items (@since 3.3)
Type:
  • string
Example
"&lt;b&gt;task&lt;/b&gt;" {string}, the item-bar displays the task string in bold
"&lt;fgcolor white&gt;&lt;bgcolor black&gt; &lt;%=%0%&gt; " {string}, the item-bar displays its type/name in black/white
"&lt;%=shortdate(%1)%&gt;&lt;br&gt;&lt;%=shortdate(%2)%&gt;" {string}, the item-bar displays its start date-time in short format on the first line, and the end date-time in short format, on the second line
"&lt;%=%C0 + %C1%&gt;" {string}, concatenates and displays the caption of first and second cell
"&lt;%=(%CD0 ? %0 : ``)%&gt;" {string}, displays the first-column only if the item's data is not empty
"&lt;b&gt;&lt;%=(%CS0 ? %0 : ``)%&gt;&lt;/b&gt;&lt;%=(%CS0 ? `` : %0)%&gt;" {string}, displays the item-bar's name in bold only if the first cell is checked )
ExtraCaption

ExtraCaptionHAlign :number

The ExtraCaptionHAlign property gets or sets the horizontal-alignment / clipping of the item-bar's extra caption inside / outside the bar. The ExtraCaption property gets or sets the bar's extra caption. The ShowExtraCaption property specifies whether the item-bar's extra caption is visible or hidden. The ExtraCaptionVAlign property specifies the vertical-alignment of the item-bar's extra caption inside / outside the bar. By default, the ExtraCaptionHAlign property is set to 1, which means that the extra caption is horizontally centered. The ExtraCaptionHAlign property supports the following values:
  • 0, 1 or 2 the caption is not clipped and it is aligned to the left, center or right side of the bar ( no clip )
  • 3, 4 or 5 the caption of the bar gets clipped to the bar's client area, else the caption is aligned to the left, center or right side of the bar ( clip, inside )
  • 6, 7 or 8 the bar's caption is hidden if its size is less or equal with MinUnitWidth property, else if it does not fit the bar's client are, gets clipped or else fully aligned to left, center or right side of the bar ( hide if min, clip if not fit, inside )
  • 9, 10 or 11 the bar's caption is hidden if it does not fit entirely into the bar's client area, else it is fully displayed aligned to the left, center or right side of the bar ( hide if not fit, no clip, inside )
  • 12, 13 or 14 the bar's caption is displayed inside of the bar's client area if it fits entirely, else it is displayed outside of the bar aligned to the left, center or right ( no clip, inside, outside )
  • 16, 17, 18, the bar's caption is displayed outside of the bar to the left or to the right ( no clip, outside )
Also, the field supports the following flag (OR combination with any other value):
  • 32 (0x20), which indicates that the bar's caption fits the bar and view (that bar's caption is aligned relative to the horizontal-intersection of the bar with the view).
Type:
  • number
Example
null {null}, the item-bar's extra caption is horizontally centered
18 {number}, the item-bar's extra caption is displayed outside of the bar to the right ( no clip, outside )
ExtraCaptionHAlign

ExtraCaptionHOffset :number

The ExtraCaptionHOffset property gets or sets the bar's extra-caption horizontal-offset (relative to its alignment/default-position). The ExtraCaptionVOffset property defines the bar's extra-caption vertical-offset (relative to its alignment/default-position). The ExtraCaption property defines the bar's extra-caption text. The ExtraCaptionHAlign property defines the bar's extra-caption horizontal-alignment. The ExtraCaptionVAlign property defines the bar's extra-caption vertical-alignment. The ShowExtraCaption property defines whether the bar's extra-caption is visible. By default, the bar's extra-caption is shown at its alignment/default-position.
Type:
  • number
Example
0 {number}, null {null}, the bar's caption is shown at its alignment/default-position
-4 {number}, the bar's caption is shown 4-pixels left to its alignment/default-position
4 {number}, the bar's caption is shown 4-pixels right to its alignment/default-position
ExtraCaptionHOffset

ExtraCaptionVAlign :number

The ExtraCaptionVAlign property gets or sets the vertical-alignment of the item-bar's extra caption inside / outside the bar. The ExtraCaption property gets or sets the bar's extra caption. The ShowExtraCaption property specifies whether the item-bar's extra caption is visible or hidden. ExtraCaptionHAlign property specifies the horizontal-alignment / clipping of the item-bar's extra caption inside / outside the bar. By default, the ExtraCaptionVAlign property is set to 1, which means that the extra caption is vertically centered. The ExtraCaptionVAlign property supports the following values:
  • 0, the caption is aligned to the top
  • 1, the caption is vertically centered
  • 2, the caption is aligned to the bottom
  • 16 (0x10), The caption is displayed outside of the item-bar (16 outside on top, 18 outside on bottom)
  • 32 (0x20), which indicates that the bar's caption fits the bar and view (that bar's caption is aligned relative to the vertical-intersection of the bar with the view).
Type:
  • number
Example
null {null}, the item-bar's extra caption is vertically centered
18 {number}, the item-bar's extra caption is displayed outside of the bar to the bottom
ExtraCaptionVAlign

ExtraCaptionVOffset :number

The ExtraCaptionVOffset property gets or sets the bar's extra-caption vertical-offset (relative to its alignment/default-position). The ExtraCaptionHOffset property defines the bar's extra-caption horizontal-offset (relative to its alignment/default-position). The ExtraCaption property defines the bar's extra-caption text. The ExtraCaptionHAlign property defines the bar's extra-caption horizontal-alignment. The ExtraCaptionVAlign property defines the bar's extra-caption vertical-alignment. The ShowExtraCaption property defines whether the bar's extra-caption is visible. By default, the bar's extra-caption is shown at its alignment/default-position.
Type:
  • number
Example
0 {number}, null {null}, the bar's caption is shown at its alignment/default-position
-4 {number}, the bar's caption is shown 4-pixels up to its alignment/default-position
4 {number}, the bar's caption is shown 4-pixels down to its alignment/default-position
ExtraCaptionVOffset

HAlignCaption :number

The HAlignCaption property gets or sets the horizontal-alignment / clipping of the item-bar's caption inside / outside the bar. The Caption property gets or sets the bar's caption. The CaptionHOffset property specifies the horizontal offset of the caption with respect to the item-bar. The CaptionVOffset property specifies the vertical offset of the caption with respect to the item-bar. The VAlignCaption property specifies the vertical alignment of the caption with respect to the item-bar. By default, the HAlignCaption property is set to 1, which means that the caption is horizontally centered. The HAlignCaption property can be any of the following values:
  • 0, 1 or 2 the caption is not clipped and it is aligned to the left, center or right side of the bar ( no clip )
  • 3, 4 or 5 the caption of the bar gets clipped to the bar's client area, else the caption is aligned to the left, center or right side of the bar ( clip, inside )
  • 6, 7 or 8 the bar's caption is hidden if its size is less or equal with MinUnitWidth property, else if it does not fit the bar's client are, gets clipped or else fully aligned to left, center or right side of the bar ( hide if min, clip if not fit, inside )
  • 9, 10 or 11 the bar's caption is hidden if it does not fit entirely into the bar's client area, else it is fully displayed aligned to the left, center or right side of the bar ( hide if not fit, no clip, inside )
  • 12, 13 or 14 the bar's caption is displayed inside of the bar's client area if it fits entirely, else it is displayed outside of the bar aligned to the left, center or right ( no clip, inside, outside )
  • 16, 17, 18, the bar's caption is displayed outside of the bar to the left or to the right ( no clip, outside )
Also, the field supports the following flag (OR combination with any other value):
  • 32 (0x20), which indicates that the bar's caption fits the bar and view (that bar's caption is aligned relative to the horizontal-intersection of the bar with the view).
Type:
  • number
Example
null {null}, the item-bar's caption is horizontally centered
18 {number}, the item-bar's caption is displayed outside of the bar to the right ( no clip, outside )
HAlignCaption

Height :number

The Height property gets or sets the bar's individual height. The GetHeight() method gets the bar's height. The Height property specifies the bar's individual height. By default, the Height property is set to null, which means that the bar's height is defined by the height of the bar of the same type/name. The Bar property gets the gantt-bar associated with the current item-bar, as an object of Bar type. The Name property indicates the name of the gantt-bar to associate with the item-bar. By default, the bar's height is determined by the height of the bar of the same type/name.
Type:
  • number
Example
null {null}, the bar's height is defined by the height of the bar of the same type/name
-1 {number}, specifies that the bar's height is determined by the item's height (the item that hosts the bar defines the bar's height)
0 {number}, defines a zero-height bar (bar is hidden)
12 {number}, the bar's height is 12-pixels tall
Height

HistLegend :string

The HistLegend property gets or sets the bar's description in histogram-legend. The histogram shows a summary of the bars' durations and their distribution over time. The exBarHistLegend option has effect only if the Bar.HistogramCumulativeOriginalColorBars is exKeepOriginalColor.

The histLegend supports exHTML format, including the <%=formula%> tag, where formula is an expression that supports

  • predefined constants
  • operators
  • % keywords such as %0 (itembar's property), %C0 (cell's value), %CD0 (cell's extra-data) or %CS0 (cell' checkbox-state)

The expression supports the following keywords:

%0, %1, %2, ... specifies the value/option of the item-bar as name, start, end and so on (ItemBarPropertyEnum type)
%C0, %C1, %C2, ... {string} specifies the caption of the cell, or the string the cell displays in the column with the index 0, 1 2, ... ( "%C0 + %C1", concatenates the caption of first and second cell )
%CD0, %CD1, %CD2, ... {any} specifies the cell's user-date in the column with the index 0, 1 2, ... ( "%CD0 ? value : ``", displays the cell's value only if the cell's data is not empty )
%CS0, %CS1, %CS2, ... {number} specifies the cell's state in the column with the index 0, 1 2, ... ( "(%CS0 ? `<b>` : ``) + value", displays the cell's value in bold only if the first cell is checked )
%CT0, %CT1, %CT2, ... {boolean} returns true if the cell displays a total field; otherwise, it returns false. The exTotalField / exTotalColumn flag specifies whether the cell displays a total field. For instance, "%CT1" refers to all cells in the second column that display totals, while "not %CT1" refers to all cells in the second column that do not display totals (@since 3.3)
%CE0, %CE1, %CE2, ... {boolean} returns true if the cell is editable; otherwise, it returns false.. For example, "%CE0" refers to all editable cells in the first column, while "not %CE1" refers to all cells in the second column that are read-only (@since 3.3)
%CC0, %CC1, %CC2, ... {number} retrieve the number of child items (this keyword consistently returns identical results for all cells since it pertains to the item that hosts each cell). The ChildCount property returns the number of child items. For example, "%CC0" identifies all parent items, while "%CC0 = 0" identifies all leaf items (@since 3.3)
%CX0, %CX1, %CX2, ... {boolean} returns true if the item hosting the cell is expanded, or false if it is collapsed (this keyword consistently returns identical results for all cells since it pertains to the item that hosts each cell). The Item.Expanded property specifically indicates whether the item is expanded or collapsed. For example, "%CX0" refers to all expanded items, while "not %CX0" identifies all collapsed items (@since 3.3)
Type:
  • string
Since:
  • 1.6
Example
"&lt;b&gt;cust&lt;/b&gt;" {string}, the legend displays the cust string in bold
"&lt;%=%0%&gt; " {string}, the legend displays the bar's type/name
"&lt;fgcolor gray&gt;&lt;%=lower(%3)%&gt;" {string}, the histogram-legend displays the bar's caption in gray and lowercase
HistLegend

Item :any

The Item property gets or sets the item to host the item-bar (moves the item-bar from an item to another). The Item property is equivalent with Parent property. The Item property can be set to any of the following:
  • item {number}, indicates a numeric value that defines the index of the item to request
  • item {string}, specifies a string expression that defines the identifier/key of the item to request
  • item {Item}, specifies the object reference to the item to request for
Type:
  • any
Since:
  • 3.3
Example
The following statements are equivalents:

 oItemBar.SetParent(item), sets the item to host the item-bar
 oItemBar.Parent = item, sets the item to host the item-bar
 oItemBar.SetItem(item), sets the item to host the item-bar
 oItemBar.Item = item, sets the item to host the item-bar

where oItemBar is an object of ItemBar type
Item

Key :string

The Key property gets or sets the bar's key. The key is used only if the item hosts multiple bars. An unique key should be assigned to every bar within the same item (if plan to use multiple bars per item). The Name property of the item-bar indicates the name of the gantt-bar to associate with the item-bar. You can use the Name property to change the type of the item-bar at runtime. The AddBar(name, start, end, key, text) method of the Item object creates and adds a new bar for the item. The key parameter specifies the key of the new bar. The CanMoveToAnother property specifies whether the bar can be moved to another item by drag and drop (requires to be selectable too). If using the CanMoveToAnother property to move the bar to another item, the key is used to identify the bar within the target item. Dragging and dropping the bar to another item that already hosts a bar with the same key is not allowed and so the operation is cancelled. By default, the key is set to null.
Type:
  • string
Example
"A" {string}, defines a bar with the key "A"
Key

Move :number

The Move property moves the item-bar by days. The Duration property gets or sets the item-bar's duration or length in days. The duration or length is computed as the difference between the item-bar's end and start margins. The Start and End properties specify the item-bar's start and end margins respectively.
Type:
  • number
Example
3 {number}, moves the item-bar by 3 days forward
-2 {number}, moves the item-bar by 2 days backward
Move

Name :string

The Name property specifies the name of the gantt-bar to associate with the item-bar. You can use the Name property to change the type of the item-bar at runtime. The Bar property gets the gantt-bar associated with the current item-bar, as an object of Bar type. The AddBar(name, start, end, key, text) method of the Item object creates and adds a new bar for the item. The Key property indicates the bar's key (used only if item hosts multiple bars). The Caption property specifies the bar's caption.
Type:
  • string
Example
"Task" {string}, defines the current bar to look and act as a "Task" bar
"Task%Progress" {string}, defines the bar to look as a "Task" bar and to display the bar's "percent" option, as an inside "Progress"-bar. The Chart.Bars.Add("Task%Progress") should be previously called to define a bar of percent-type.
Name

Offset :number

The Offset property or gets sets the bar's vertical-offset. The offset shifts vertically the item bar by the specified number of pixels. A positive value shifts the item bar downwards, while a negative value shifts the item bar upwards. By default, the offset is 0 (the item bar is shown in its default position, ussualy centered to the item, while it is not part of overlaid-bars). The Offset property has no effect if the bar is not part of overlaid-bars. The OverlaidType property indicates whether the item-bar is part of overlaid-bars, and the type of overlaid-bars. By default, the Offset property is null, which indicates that the item bar is shown in its default position.
Type:
  • number
Example
0 {number} or null {null}, the item bar is shown in its default position, ussualy centered to the item, while it is not part of overlaid-bars
-4 {number}, shifts vertically the item bar by 4-pixels
Offset

Options :ItemBarOptions

The Options property gets or sets the item-bar's options (caption, movable, resizable ...) at once. Each option of the ItemBarOptions type has associated a property of the ItemBar object, which means that the following statements are equivalent:
oItemBar.Options = {caption: "pointer"}
oItemBar.SetOptions({caption: "pointer"})
oItemBar.Caption = "pointer"
oItemBar.SetCaption("pointer")
where oItemBar is an object of ItemBar type.
Type:
Example
{caption: "pointer", canResize: 0} {ItemBarOptions}, defines the bar's caption to "pointer" and disables the bar's resizing at runtime
{canMove: false, canMoveToAnother: true} {ItemBarOptions}, disables the bar's moving within the same item, and enables the bar's moving to another item at runtime
Options

OverlaidKey :string

The OverlaidKey property gets or sets the z-order of the bar when it overlaps other bars (exOverlaidBarsCascade type). The OverlaidType property indicates whether the bar is part of overlaid-bars, and which is the overlaid-type. All overlaid-bars of the same overlaid-key are displayed on the same level. By default, the overlaid-key is an empty string, which indicates that the bar is shown at the bottom level when it overlaps other bars.
Type:
  • string
Example
"Z" {string}, all overlaid-bars of the same overlaid-key "Z" are displayed on the same level
OverlaidKey

OverviewColor :string

The OverviewColor property gets or sets the item-bar's individual overview-color. The OverviewColor property accepts any CSS color format, such as color names ("red"), hexadecimal ("#FF0000"), RGB ("rgb(255,0,0)"), RGBA ("rgba(255,0,0,1)"), HSL ("hsl(0,100%,50%)"), HSLA ("hsla(0,100%,50%,1)"), and so on. If the overviewColor is not set for the item-bar, the control uses the bar's overviewColor. If the bar's overviewColor is not set, the control uses the item-bar's shape fillColor, patternColor or frameColor (the first truthy value in this order). If none of these colors are set, the item-bar is not shown within the overview.
Type:
  • string
Example
"" {string} or null{null}, the overview color of the current item-bar is defined by the bar's overviewColor, item-bar's shape fill, pattern or frame color (the first truthy value in this order)
"transparent" or "rgba(0,0,0,0)" {string}, the overview representation of the current item-bar is hidden
"red" or "#FF0000", "rgb(255,0,0)", "rgba(255,0,0,1)", ... {string}, the current item-bar is shown in red within the control's overview
OverviewColor

Parent :any

The Parent property gets or sets the item to host the item-bar (moves the item-bar from an item to another). The Parent property is equivalent with Item property. The Parent property can be set to any of the following:
  • item {number}, indicates a numeric value that defines the index of the item to request
  • item {string}, specifies a string expression that defines the identifier/key of the item to request
  • item {Item}, specifies the object reference to the item to request for
Type:
  • any
Example
The following statements are equivalents:

 oItemBar.SetParent(item), sets the item to host the item-bar
 oItemBar.Parent = item, sets the item to host the item-bar
 oItemBar.SetItem(item), sets the item to host the item-bar
 oItemBar.Item = item, sets the item to host the item-bar

where oItemBar is an object of ItemBar type
Parent

Percent :number

The Percent property gets or sets the bar's percent as a value from 0(0%) to 1(100%) (Only bars of percent-type ("A%B") display and handle the inner progress-bar). The percent indicates the progress made within the bar's duration. The percent is a value between 0 and 1, where 0 means that no progress has been made, and 1 means that the bar's work is completed. The PercentCaptionFormat property specifies how the percent-caption is displayed. The CanResizePercent property indicates whether the percent can be changed by resizing the inner progress-bar with the mouse. The ResizePercentStep property specifies the step to increase or decrease the percent when resizing the inner progress-bar with the mouse. The ShowPercentCaption property indicates whether the percent-caption is visible or hidden. By default, the percent-value is 0 (0%).
Type:
  • number
Example
0 {number} or null {null}, the bar's percent is set to 0%
1 {number}, the bar's percent is set to 100%
Percent

PercentCaptionFormat :string

The PercentCaptionFormat property gets or sets the HTML format to display the bar's percent (%p keyword defines the bar's percent). The CanResizePercent property indicates whether the percent can be changed by resizing the inner progress-bar with the mouse. The ResizePercentStep property specifies the step to increase or decrease the percent when resizing the inner progress-bar with the mouse. The ShowPercentCaption property indicates whether the percent-caption is visible or hidden. The percent indicates the progress made within the bar's duration. The percent is a value between 0 and 1, where 0 means that no progress has been made, and 1 means that the bar's work is completed. By default, the property is set to "%p%", meaning that the percent is shown in white color with black shadow and a percent (%) character.
Type:
  • string
Example
"" {string}, displays the bar's percent as it is (no % character is displayed)
"&lt;b&gt;%p%&lt;/b&gt;" {string}, shows the bar's percent in bold
PercentCaptionFormat

Predecessor :string

The Predecessor property gets or sets the list of predecessor bars, separated by comma. The Successor property has the same format as Predecessor property, but it defines the list of successor bars. Tasks may have multiple predecessors or multiple successors. Before you begin establishing dependencies, it's important to understand that there are four types:
  • Finish to Start (FS), the predecessor ends before the successor can begin
  • Start to Start (SS), the predecessor begins before the successor can begin
  • Finish to Finish (FF), the predecessor ends before the successor can end
  • Start to Finish (SF), the predecessor begins before the successor can end

The format of bar's predecessor is INDEX1["SF"|"FS"|"FF"|"SS"][KEY][:["W"]LAG|:LAG["W"]], where:

  • INDEX1 is the 1-based index of the item that hosts the bar
  • followed by the type of the link which can be one any of SF(Start-Finish), FS(Finish-Start), SS(Start-Start) or FF(Finish-Finish) sequence (FS if missing)
  • continues with the KEY of the bar (empty is not used)
  • and ends with the LAG of the link (specifies the delay the activity is postponed by the link). The "W" indicates a working-lag for the link (specifies the delay in working-units the activity is postponed by the link). 
Type:
  • string
Since:
  • 2.3
Example
"2FSZ", specifies that the current item-bar is linked with the "Z" bar of the second item (item with the index 1) using a Finish-Start link
  "1SF:-2", adds a Start-Finish link with the bar '' of the first-item, using a lag of -2 days
Predecessor

ResizePercentStep :number

The ResizePercentStep property gets or sets the step increment used when resizing the bar's percent value (`exBarPercent`) via drag-and-drop at runtime. Behavior:
  • only applies to user-driven resizing at runtime. Programmatic changes to exBarPercent ignore this step
  • ensures that the bar snaps to predictable increments, making layout adjustments more consistent and controlled
The CanResizePercent property indicates whether the percent can be changed by resizing the inner progress-bar with the mouse. The ShowPercentCaption property indicates whether the percent-caption is visible or hidden. The percent indicates the progress made within the bar's duration. The percent is a value between 0 and 1, where 0 means that no progress has been made, and 1 means that the bar's work is completed. By default, the property is set to null, allowing freeform resizing.

The ResizePercentStep property indicates a unitary number between 0 and 1 that defines the resizing step, as explained:

  • 0 (default), the bar can be resized freely to any value between 0% and 100%
  • > 0, the bar resizes in fixed steps equal to the specified fraction of 100% of its container
Type:
  • number
Since:
  • 5.0
Example
null {null} or {0}, the bar can be resized freely to any value between 0% and 100%
0.05 {number}, the bar moves in 5% increments
0.1 {number}, the bar moves in 10% increments
ResizePercentStep

ResourceFormat :string

The ResourceFormat property specifies the format for displaying a bar's resource. The Resources property gets or sets the resources to be used by the current bar, separated by commas. The resources property is a string that specifies the list of resources, including their usage, or 100% if not specified. Resources are separated by commas, and usage is indicated as a double expression using a dot as the decimal separator. For example, Resource1,Resource2,Resource3 indicates that the bar uses Resource1, Resource2, and Resource3 at 100% each, while R1,R2[50%],R3[67.89%] specifies that the bar uses R1 at 100%, R2 at 50%, and R3 at 67.89%. The <%=%49%> sequence within the item-bar's caption displays the item's bar resource usage, including the percentage if applicable. The ResourceFormat's expression supports the following keywords:
  • name {string}, indicates the name of the resource
  • percent {number}, indicates the usage percentage of the resource as a value between 0 and 1

The expression can include exHTML tags to format the output, such as <b> for bold text, <font> for font styling, and <fgcolor> for foreground color. You can also use conditional logic and formatting functions to customize the display further.

The <%=%266%> sequence within the item-bar's caption displays the item's bar resource usage according to 'resourceFormat' field.
Type:
  • string
Since:
  • 3.2
Example
null {null}, displays the default format, equivalent of "name + ((percent - 1)? `[` + round(percent*100) + `%]` : ``)"
"name" {string}, displays just the name of the resource
"name + ((percent - 1)? `(` + round(percent*100) + `%)` : ``)" {string}, displays the name of the resource followed by its percentage in parentheses
ResourceFormat

Resources :string

The Resources property specifies the resources to be used by the current bar, separated by commas. The resources property is a string that specifies the list of resources, including their usage, or 100% if not specified. Resources are separated by commas, and usage is indicated as a double expression using a dot as the decimal separator. For example, Resource1,Resource2,Resource3 indicates that the bar uses Resource1, Resource2, and Resource3 at 100% each, while R1,R2[50%],R3[67.89%] specifies that the bar uses R1 at 100%, R2 at 50%, and R3 at 67.89%. The ResourceFormat property specifies the format for displaying a bar's resource. The Resources property can be set using the following rules:
  • If the first character is a plus sign (+), the rest of the expression indicates the resources to be added to the current bar. For instance, if the current bar has the 'resources' property set to "R1,R2" and we set 'resources' to "+R3", it means that "R3" is added to the bar's resources, resulting in a new 'resources' property of "R1,R2,R3"
  • If the first character is a minus sign (-), the rest of the expression indicates the resources to be removed from the current bar. For instance, if the current bar has the 'resources' property set to "R1,R2" and we set 'resources' to "-R2", it means that "R2" is removed from the bar's resources, resulting in a new 'resources' property of "R1"
  • If no + or - character is used, setting the 'resources' property replaces its current value entirely. For example, if the current bar has 'resources' set to "R1,R2" and we set 'resources' to "R3,R4", it means the new 'resources' property will be "R3,R4". This replaces the previous resources with the new ones specified.

The <%=%49%> sequence within the item-bar's caption displays the item's bar resource usage, including the percentage if applicable.

Type:
  • string
Since:
  • 3.2
Example
"R1,R2" {string}, allocates the R1 and R2 resources to the current bar
"R1[50%],R2[10%]" {string}, allocates 50% of R1 resources and 10% of R2 resource to the current bar
"+R3[34%]" {string}, adds 34% of R3 resource
Resources

Selectable :boolean

The Selectable property specifies whether the bar is selectable or unselectable. The unselectable bars cannot be selected by the user and so it can not be resized or moved by the user as well. The Selected property indicates whether the bar is selected or unselected. The CanMove and CanResize properties specify whether the bar can be moved or resized by the user. If Selectable property is set to false the user cannot select, move or resize the bar, and so the CanMove and CanResize properties are ignored for that bar. The Chart.SingleSel property specifies whether only one or more bars can be selected at once by the user. By default, the Selectable property is set to true, which means that the bar is selectable by the user.
Type:
  • boolean
Example
false {boolean}, the item-bar is unselectable (the user can select the item-bar)
true {boolean}, the item-bar is selectable
Selectable

Selected :boolean

The Selected property selects or unselects the current-bar. Use the Selected property to programmatically select or unselect the item-bar. The GetSelected() method indicates whether the bar is selected or unselected. The Selectable property specifies whether the bar is selectable or unselectable. The Chart.SingleSel property specifies whether only one or more bars can be selected at once by the user. By default, the Selected property is set to false, which means that the bar is unselected.
Type:
  • boolean
Example
false {boolean}, unselects the bar
true {boolean}, selects the bar
Selected

Shape :string

The Shape property gets or sets the bar's individual shape. The shape specifies the visual-appearance of the bar's background. The Bar property gets the gantt-bar associated with the current item-bar, as an object of Bar type. The Name property indicates the name of the gantt-bar to associate with the item-bar. You can use the Name property to change the type of the item-bar at runtime. By default, the Shape property is null, indicating that no individual shape is applied to the item-bar. In this case, the shape defined by the associated gantt-bar is applied to the item-bar. The Shape property specifies bar's individual shape, as one of the following:
  • the shape's name within the exontrol.Shapes.Tree or exontrol.Shapes namespace
  • a CSS color
  • a JSON string-representation of an object of exontrol.Def.Shape type, for the column itself
  • an object of {normal,hover,click,disabled} type. The normal, hover, click and disabled are objects of exontrol.Def.Shape type
Type:
  • string
Example
"" {string}, null {null}, no shape is applied
"red" {string}, fills the object's background in red (CSS color)
'{"fillColor": "red"}' or '{"normal":{"fillColor": "red"}}' {string}, fills the object's background in red (JSON-representation of an object of exontrol.Def.Shape type)
"xxx" {string}, indicates that exontrol.Shapes.Gantt.xxx or exontrol.Shapes.xxx is applied on the object's background. If the xxx field is missing, no custom shape is applied (no default object's shape is be applied)
"Button" or exontrol.Shapes.Button {object}, applies the "Button" shape on the object as defined into exontrol.Shapes namespace (@since 5.2)
Shape

ShowCaption :boolean

The ShowCaption property shows or hides the item-bar's caption. The Caption property gets or sets the bar's caption. The ToolTip property specifies the text displayed as a tooltip when the mouse pointer hovers over the item-bar. The CaptionHOffset property specifies the horizontal offset of the caption with respect to the item-bar. The CaptionVOffset property specifies the vertical offset of the caption with respect to the item-bar. The HAlignCaption property specifies the horizontal alignment of the caption with respect to the item-bar. The VAlignCaption property specifies the vertical alignment of the caption with respect to the item-bar. By default, the item-bar's caption is visible.
Type:
  • boolean
Example
false {boolean}, hides the item-bar's caption
true {boolean}, shows the item-bar's caption
ShowCaption

ShowExtraCaption :boolean

The ShowExtraCaption property shows or hides the item-bar's extra caption. The Caption property gets or sets the bar's caption. The ExtraCaption property gets or sets the bar's extra caption. ExtraCaptionHAlign property specifies the horizontal-alignment / clipping of the item-bar's extra caption inside / outside the bar. The ExtraCaptionVAlign property specifies the vertical-alignment of the item-bar's extra caption inside / outside the bar. The Caption property gets or sets the bar's caption. The ExtraCaptionHOffset property specifies the horizontal offset of the extra caption with respect to the item-bar. The ExtraCaptionVOffset property specifies the vertical offset of the extra caption with respect to the item-bar. By default, the item-bar's extra caption is visible.
Type:
  • boolean
Example
false {boolean}, hides the item-bar's extra caption
true {boolean}, shows the item-bar's extra caption
ShowExtraCaption

ShowPercentCaption :boolean

The ShowPercentCaption property shows or hides the bar's percent-caption (Only bars of percent-type ("A%B") display and handle the inner progress-bar). The AlignPercentCaption property horizontally aligns the bar's percent-caption. The Percent property gets or sets the bar's percent as a value from 0(0%) to 1(100%). The percent indicates the progress made within the bar's duration. The percent is a value between 0 and 1, where 0 means that no progress has been made, and 1 means that the bar's work is completed. The PercentCaptionFormat property specifies how the percent-caption is displayed. The CanResizePercent property indicates whether the percent can be changed by resizing the inner progress-bar with the mouse. The ResizePercentStep property specifies the step to increase or decrease the percent when resizing the inner progress-bar with the mouse. By default, the percent-caption is hidden.
Type:
  • boolean
Example
false {boolean} or null {null}, the bar's percent-caption is hidden
true {boolean}, the bar's percent-caption is shown
ShowPercentCaption

Start :any

The Start property gets or sets the date-time the bar starts from. The End property gets or sets the date-time the bar ends to. The Duration property gets or sets the item-bar's duration in days (or hours if including the decimal point, for instance 0.5 indicates a 12 hours lenght). The Move method moves the item-bar by days(or hours if including the decimal point, for instance 0.5 moves by 12 hours). The onbarresize event is triggered when a user finishes dragging an item-bar to move or resize it. The onbarresizing event occurs while the user is resizing or moving an item-bar by drag. The Start property can be set to one of the following:
  • value {null}, indicates the current date and time (equivalent of Now)
  • value {string}, defines the date in string-format as "#MM/DD/YYYY[ HH:mm:ss]#"
  • value {Date}, indicates a JavaScript date to be copied
  • value {number} integer value representing the year of the date to be created
Type:
  • any
Example
"#1/1/2001#" {string}, defines the bar's start date-time as January 1st, 2001
Date.Today() {Date}, changes the bar's start date-time to today
Start

Successor :string

The Successor property gets or sets the list of successor bars, separated by comma. The Predecessor property has the same format as Successor property, but it defines the list of predecessor bars. Tasks may have multiple predecessors or multiple successors. Before you begin establishing dependencies, it's important to understand that there are four types:
  • Finish to Start (FS), the predecessor ends before the successor can begin
  • Start to Start (SS), the predecessor begins before the successor can begin
  • Finish to Finish (FF), the predecessor ends before the successor can end
  • Start to Finish (SF), the predecessor begins before the successor can end

The format of bar's successor is INDEX1["SF"|"FS"|"FF"|"SS"][KEY][:["W"]LAG|:LAG["W"]], where:

  • INDEX1 is the 1-based index of the item that hosts the bar
  • followed by the type of the link which can be one any of SF(Start-Finish), FS(Finish-Start), SS(Start-Start) or FF(Finish-Finish) sequence (FS if missing)
  • continues with the KEY of the bar (empty is not used)
  • and ends with the LAG of the link (specifies the delay the activity is postponed by the link). The "W" indicates a working-lag for the link (specifies the delay in working-units the activity is postponed by the link). 
Type:
  • string
Since:
  • 2.3
Example
"3SFy",  specifies that the current item-bar is linked with the "y" bar of the third item (item with the index 1) using a Start-Finish link
Successor

SummaryBarShape :string

The SummaryBarShape property gets or sets the shape to apply on the background of all summary-bar's child item-bars. The summary-bar is an item-bar that includes other item-bars as child bars. The DefineSummaryBars method of the control defines which item-bars are summary-bars. The Shape property defines the shape to apply on the background of the item-bar itself. The SummaryBarShape property specifies the shape to apply on the background of all summary-bar's child item-bars, as one of the following:
  • the shape's name within the exontrol.Shapes.Tree or exontrol.Shapes namespace
  • a CSS color
  • a JSON string-representation of an object of exontrol.Def.Shape type, for the column itself
  • an object of {normal,hover,click,disabled} type. The normal, hover, click and disabled are objects of exontrol.Def.Shape type
By default, no shape is applied on the background of summary-bar's child item-bars.
Type:
  • string
Example
"" {string}, null {null}, no shape is applied
"red" {string}, fills the object's background in red (CSS color)
'{"fillColor": "red"}' or '{"normal":{"fillColor": "red"}}' {string}, fills the object's background in red (JSON-representation of an object of exontrol.Def.Shape type)
"xxx" {string}, indicates that exontrol.Shapes.Gantt.xxx or exontrol.Shapes.xxx is applied on the object's background. If the xxx field is missing, no custom shape is applied (no default object's shape is be applied)
"Button" or exontrol.Shapes.Button {object}, applies the "Button" shape on the object as defined into exontrol.Shapes namespace (@since 5.2)
SummaryBarShape

ToolTip :string

The ToolTip property gets or sets the bar's tool-tip. The tooltip is displayed when the mouse pointer hovers over the item-bar. The Caption property gets or sets the bar's caption. The CaptionHOffset property specifies the horizontal offset of the caption with respect to the item-bar. The CaptionVOffset property specifies the vertical offset of the caption with respect to the item-bar. The HAlignCaption property specifies the horizontal alignment of the caption with respect to the item-bar. The VAlignCaption property specifies the vertical alignment of the caption with respect to the item-bar. By default, the item-bar's caption is visible.

The tooltip supports exHTML format, including the <%=formula%> tag, where formula is an expression that supports predefined constants, operators and % keywords such as %0 (itembar's property), %C0 (cell's value), %CD0 (cell's extra-data) or %CS0 (cell' checkbox-state)

The expression supports the following keywords:
%0, %1, %2, ... specifies the value/option of the item-bar as name, start, end and so on (ItemBarPropertyEnum type)
%C0, %C1, %C2, ... {string} specifies the caption of the cell, or the string the cell displays in the column with the index 0, 1 2, ... ( "%C0 + %C1", concatenates the caption of first and second cell )
%CD0, %CD1, %CD2, ... {any} specifies the cell's user-date in the column with the index 0, 1 2, ... ( "%CD0 ? value : ``", displays the cell's value only if the cell's data is not empty )
%CS0, %CS1, %CS2, ... {number} specifies the cell's state in the column with the index 0, 1 2, ... ( "(%CS0 ? `<b>` : ``) + value", displays the cell's value in bold only if the first cell is checked )
%CT0, %CT1, %CT2, ... {boolean} returns true if the cell displays a total field; otherwise, it returns false. The exTotalField / exTotalColumn flag specifies whether the cell displays a total field. For instance, "%CT1" refers to all cells in the second column that display totals, while "not %CT1" refers to all cells in the second column that do not display totals (@since 3.3)
%CE0, %CE1, %CE2, ... {boolean} returns true if the cell is editable; otherwise, it returns false.. For example, "%CE0" refers to all editable cells in the first column, while "not %CE1" refers to all cells in the second column that are read-only (@since 3.3)
%CC0, %CC1, %CC2, ... {number} retrieve the number of child items (this keyword consistently returns identical results for all cells since it pertains to the item that hosts each cell). The ChildCount property returns the number of child items. For example, "%CC0" identifies all parent items, while "%CC0 = 0" identifies all leaf items (@since 3.3)
%CX0, %CX1, %CX2, ... {boolean} returns true if the item hosting the cell is expanded, or false if it is collapsed (this keyword consistently returns identical results for all cells since it pertains to the item that hosts each cell). The Item.Expanded property specifically indicates whether the item is expanded or collapsed. For example, "%CX0" refers to all expanded items, while "not %CX0" identifies all collapsed items (@since 3.3)
Type:
  • string
Example
"&lt;b&gt;task&lt;/b&gt;" {string}, the tooltip displays the task string in bold
"&lt;%=%0%&gt; " {string}, the tooltip displays the bar's type/name
"Start: &lt;%=shortdate(%1)%&gt;&lt;br&gt;End: &lt;%=shortdate(%2)%&gt;" {string}, the tooltip displays the bar's start date-time in short format on the first line, and the end date-time in short format, on the second line
"&lt;%=%C0 + %C1%&gt;" {string}, concatenates and displays the caption of first and second cell
"Duration: &lt;%=((1:=int(0:= (%513))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%&gt;", {string} shows the item-bar's duration/length in days, hours and minutes
ToolTip

VAlignCaption :number

The VAlignCaption property gets or sets the vertical-alignment of the item-bar's caption inside / outside the bar. The Caption property gets or sets the bar's caption. The CaptionHOffset property specifies the horizontal offset of the caption with respect to the item-bar. The CaptionVOffset property specifies the vertical offset of the caption with respect to the item-bar. The HAlignCaption property specifies the horizontal alignment of the caption with respect to the item-bar. By default, the VAlignCaption property is set to 1, which means that the caption is vertically centered. The VAlignCaption property supports the following values:
  • 0, the caption is aligned to the top
  • 1, the caption is vertically centered
  • 2, the caption is aligned to the bottom
  • 16 (0x10), The caption is displayed outside of the item-bar (16 outside on top, 18 outside on bottom)
  • 32 (0x20), which indicates that the bar's caption fits the bar and view (that bar's caption is aligned relative to the vertical-intersection of the bar with the view).
Type:
  • number
Example
null {null}, the item-bar's caption is vertically centered
18 {number}, the item-bar's caption is displayed outside of the bar to the bottom
VAlignCaption

Methods

DateToPercent(date) → {number}

The DateToPercent() method gets the percent of the giving date relative to the start/end margins of the bar, as 0 for start and 1(100%) for end margin of the bar. The Start property gets or sets the date-time the bar starts from. The End property gets or sets the date-time the bar ends to. The Duration property gets or sets the item-bar's duration in days (or hours if including the decimal point, for instance 0.5 indicates a 12 hours lenght).
Parameters:
Name Type Description
date any Specifies the date to get percent for, as explained:
  • date {string}, defines the date in string-format as "#MM/DD/YYYY[ HH:mm:ss]#"
  • date {Date}, indicates a JavaScript date to be copied
  • date {number} integer value representing the year of the date to be created
  • date {null}, indicates the current date and time (equivalent of Now)
Returns:
Returns the percent of date relative to the start/end margins of the bar
Type
number
Example
oItemBar.DateToPercent("2024-01-01"), gets the percent of "2024-01-01" date relative to the start/end margins of the bar
 oItemBar.DateToPercent(new Date(2024, 0, 1)), gets the percent of "2024-01-01" date relative to the start/end margins of the bar
DateToPercent

DefineSummaryBars(itemAdd, keyAdd)

The DefineSummaryBars() method defines bars of the summary bar. The summary bar is an item-bar that includes other item-bars as child bars. The summary bar is useful to define a bar that summarizes other bars (for instance, a summary bar that summarizes the progress of other bars). The summary bar is defined by including other item-bars as child bars of the summary bar. The DefineSummaryBars method defines which item-bars are included as child bars into the summary bar. The SummaryBarShape property defines the shape to apply on the background of all summary-bar's child item-bars. By default, no shape is applied on the background of summary-bar's child item-bars. The UndefineSummaryBars(itemRemove, keyRemove) method undefines bars of the summary bar.
Parameters:
Name Type Description
itemAdd any Indicates an item-bar itself (one argument), or the item that hosts the item-bar (two arguments), as explained:
  • itemAdd {ItemBar}, specifies the item-bar itself, as an object of ItemBar type (keyAdd parameter has no effect)
  • itemAdd {ItemBar[]}, specifies a collection of item-bars, as an array of [ItemBar] type (keyAdd parameter has no effect)
  • itemAdd {object}, specifies a collection of item-bars, as an object of exontrol.Arr([ItemBar]) type (keyAdd parameter has no effect)
  • itemAdd {Item}, specifies the item itself, as an object of Item type
  • itemAdd {Item[]}, specifies a collection of items, as an array of [Item] type
  • itemAdd {object}, specifies a collection of items, as an object of exontrol.Arr([Item]) type
  • itemAdd {Items}, specifies all items, as an object of Items type
  • 0 {number}, indicates all items
  • -1 {number}, indicates the direct descendents/children items of the current item
  • -2 {number}, indicates the leaf descendents/items of the current item (where a leaf or terminal item is an item with no child items)
  • -3 {number}, indicates all descendents/children items of the current item (recursively)
keyAdd any indicates the key of the bar to include in the summary bar (null/undefined for keyMatch equivalent of all or "<*>"). The keyAdd parameter supports pattern if specified such as "", where the pattern may contain wild card characters such as:
  • '?' for any single character
  • '*' for zero or more occurrences of any character
  • '#' for any digit character
(for instance, DefineSummaryBars(,"") includes bars whose key start with character K into the summary bar).
Example
oItemBar.DefineSummaryBars(0, "&lt;*&gt;"), includes all bars of all items into the summary bar
 oItemBar.DefineSummaryBars(0, "&lt;K*&gt;"), includes bars whose key start with character K of all items into the summary bar
 oItemBar.DefineSummaryBars(-1, "&lt;*&gt;"), includes all bars of direct descendent/children items into the summary bar
 
DefineSummaryBars

Remove()

The Remove() method removes the bar itself from its collection (removes the item-bar from the item). The method is equivalent to the Remove(oItemBar) method of the ItemBars collection, which removes the item-bar from the item by calling the Remove() method of the item-bar itself. The Parent property returns the item that hosts the item-bar, as an object of Item type.
Example
The following statements are equivalent:

 oItemBar.Remove(), removes the item-bar from the item
 oItemBar.Parent.Bars.Remove(oItemBar), removes the item-bar from the item

where oItemBar is an object of ItemBar type
 
Remove

UndefineSummaryBars(itemRemove, keyRemove)

The UndefineSummaryBars() method undefines bars of the summary bar. The summary bar is an item-bar that includes other item-bars as child bars. The summary bar is useful to define a bar that summarizes other bars (for instance, a summary bar that summarizes the progress of other bars). The summary bar is defined by including other item-bars as child bars of the summary bar. The DefineSummaryBars method defines which item-bars are included as child bars into the summary bar. The SummaryBarShape property defines the shape to apply on the background of all summary-bar's child item-bars. By default, no shape is applied on the background of summary-bar's child item-bars. The DefineSummaryBars(itemAdd, keyAdd) method defines bars of the summary bar.
Parameters:
Name Type Description
itemRemove any Indicates an item-bar itself (one argument), or the item that hosts the item-bar (two arguments), as explained:
  • itemRemove {ItemBar}, specifies the item-bar itself, as an object of ItemBar type (keyRemove parameter has no effect)
  • itemRemove {ItemBar[]}, specifies a collection of item-bars, as an array of [ItemBar] type (keyRemove parameter has no effect)
  • itemRemove {object}, specifies a collection of item-bars, as an object of exontrol.Arr([ItemBar]) type (keyRemove parameter has no effect)
  • itemRemove {Item}, specifies the item itself, as an object of Item type
  • itemRemove {Item[]}, specifies a collection of items, as an array of [Item] type
  • itemRemove {object}, specifies a collection of items, as an object of exontrol.Arr([Item]) type
  • itemRemove {Items}, specifies all items, as an object of Items type
  • 0 {number}, indicates all items
  • -1 {number}, indicates the direct descendents/children items of the current item
  • -2 {number}, indicates the leaf descendents/items of the current item (where a leaf or terminal item is an item with no child items)
  • -3 {number}, indicates all descendents/children items of the current item (recursively)
keyRemove any indicates the key of the bar to exclude from the summary bar (null/undefined for keyMatch equivalent of all or "<*>"). The keyRemove parameter supports pattern if specified such as "", where the pattern may contain wild card characters such as:
  • '?' for any single character
  • '*' for zero or more occurrences of any character
  • '#' for any digit character
(for instance, UndefineSummaryBars(,"") excludes bars whose key start with character K from the summary bar).
Example
oItemBar.UndefineSummaryBars(0, "&lt;*&gt;), excludes all bars of all items from the summary bar
  oItemBar.UndefineSummaryBars(0, "&lt;K*&gt;), excludes bars whose key start with character K of all items from the summary bar
  oItemBar.UndefineSummaryBars(-1, "&lt;*&gt;), excludes all bars of direct descendent/children items from the summary bar
UndefineSummaryBars