TimeAxisColumn

A column containing the timeline "viewport", in which tasks, dependencies etc. are drawn. Normally you do not need to interact with or create this column, it is handled by Gantt.

Styling

You can style a timeaxis cell by using the afterRenderCell method.

const gantt = new Gantt({
   appendTo : document.body,
   columns : [
       {
           type : 'timeAxis',
           afterRenderCell({ cellElement, record }) {
               cellElement.style.background = 'rgba(255,200,0,0.15)';
           }
       }
   ]
});

Time axis column
//<code-header>
fiddle.title = 'Time axis column';
//</code-header>
const gantt = new Gantt({
    appendTo : targetElement,
    height   : 350,

    subGridConfigs : {
        locked : { flex : 1 },
        normal : { flex : 2 }
    },

    project : {
        startDate : new Date(2020, 0, 1),
        events    : [
            { id : 1, name : 'Half done task', startDate : '2020-01-02', endDate : '2020-01-05' },
            { id : 2, name : 'Finalized task', startDate : '2020-01-09', endDate : '2020-01-10' },
            { id : 3, name : 'Way more work than needed', startDate : '2020-01-09', endDate : '2020-01-10' }
        ]
    },

    columns : [
        { type : 'name', flex : 1 },
        {
            type : 'timeAxis',
            afterRenderCell({ cellElement, record }) {
                if (record.id === 1) {
                    cellElement.style.background = 'rgba(255,200,0,0.15)';
                }
                else {
                    cellElement.style.background = 'unset';
                }
            }
        }
    ]
});

Configs

81

Common

autoWidthColumn
fieldColumn
fitModeColumn
flexColumn
listenersEvents
maxWidthColumn
textColumn
widgetsWidgetColumn
widthColumn

Menu

Set to false to disable the TaskMenu for the cell elements in this column.

showColumnPickerTimeAxisColumn

Accessibility

ariaLabelColumn

Export

Integration

vueColumn

Interaction

collapsedColumn
draggableTimeAxisColumn
editorColumn
filterableTimeAxisColumn
groupableTimeAxisColumn
hideableTimeAxisColumn
resizableTimeAxisColumn
sealedColumn
searchableTimeAxisColumn
sortableTimeAxisColumn

Layout

alignColumn
hiddenColumn
lockedColumn
minWidthColumn
regionColumn

Merge cells

mergeableColumn

Misc

localeClassLocalizable
localizableLocalizable
tagsColumn
treeColumn

Other

formulaColumn
pinnedColumn
readOnlyColumn

Rendering

afterRenderCellWidgetColumn
cellClsColumn
clsTimeAxisColumn
iconColumn
rendererWidgetColumn
tooltipColumn

Summary

sumColumn
summariesColumn

Properties

152

Common

autoWidthColumn
fieldColumn
fitModeColumn
flexColumn
maxWidthColumn
textColumn
widgetsWidgetColumn
widthColumn

Class hierarchy

isTimeAxisColumn: Boolean= truereadonly
Identifies an object as an instance of TimeAxisColumn class, or subclass thereof.
isTimeAxisColumn: Boolean= truereadonlystatic
Identifies an object as an instance of TimeAxisColumn class, or subclass thereof.
isColumnColumn
isEventsEvents
isLocalizableLocalizable
isModelModel
isModelLinkModelLink
isModelStmModelStm
isTreeNodeTreeNode
isWidgetColumnWidgetColumn

Menu

Set to false to disable the TaskMenu for the cell elements in this column.

showColumnPickerTimeAxisColumn

Accessibility

ariaLabelColumn

Editing

copyOfModel
isValidModel

Export

Fields

allFieldsstaticModel
autoExposeFieldsstaticModel
childrenFieldstaticModel
fieldMapstaticModel
fieldsstaticModel
idFieldstaticModel

Grouping

Identification

keyModel

Integration

vueColumn

Interaction

collapsedColumn
draggableTimeAxisColumn
editorColumn
filterableTimeAxisColumn
groupableTimeAxisColumn
hideableTimeAxisColumn
resizableTimeAxisColumn
sealedColumn
searchableTimeAxisColumn
sortableTimeAxisColumn

JSON

jsonModel

Layout

alignColumn
hiddenColumn
lockedColumn
minWidthColumn
regionColumn

Lifecycle

configBase

Linked records

hasLinksModelLink
isLinkedModelLink
recordLinksModelLink

Merge cells

mergeableColumn

Misc

localeHelperLocalizable
localeManagerLocalizable
stmModelStm
tagsColumn
treeColumn

Other

$namestaticModel
defaultsColumn
elementColumn
formulaColumn
gridColumn
pinnedColumn
readOnlyColumn
relationsstaticModel
subGridColumn
typestaticColumn
visibleColumn

Parent & children

allChildrenTreeNode
childLevelTreeNode
firstChildTreeNode
isLeafTreeNode
isLoadedTreeNode
isParentTreeNode
isRootTreeNode
lastChildTreeNode
nextSiblingTreeNode
parentTreeNode
parentIdTreeNode

Rendering

afterRenderCellWidgetColumn
cellClsColumn
clsTimeAxisColumn
iconColumn
rendererWidgetColumn
tooltipColumn

Summary

sumColumn
summariesColumn

Functions

78

Configuration

applyDefaultsstaticBase

Editing

copyModel
getDataModel
removeModel
setModel

Events

Fields

addFieldstaticModel
getModel
processFieldstaticModel
removeFieldstaticModel

Identification

asIdstaticModel

JSON

toJSONModel

Lifecycle

destroystaticBase

Misc

equalsModel
initClassstaticBase
isOfTypeNamestaticBase
linkModelLink
mixinstaticBase
optionalLstaticLocalizable

Other

hideColumn
LstaticLocalizable
onEvents
refreshHeaderTimeAxisColumn
relayAllEvents
showColumn
toggleColumn
triggerEvents
unEvents

Parent & children

appendChildTreeNode
bubbleTreeNode
bubbleWhileTreeNode
containsTreeNode
isExpandedTreeNode
removeChildTreeNode
traverseTreeNode

Events

5

Event handlers

5

Typedefs

2