TimeAxis

A class representing the time axis of the scheduler. The scheduler timescale is based on the ticks generated by this class. This is a pure "data" (model) representation of the time axis and has no UI elements.

The time axis can be continuous or not. In continuous mode, each timespan starts where the previous ended, and in non-continuous mode there can be gaps between the ticks. A non-continuous time axis can be used when want to filter out certain periods of time (like weekends) from the time axis.

To create a non-continuous time axis you have 2 options. First, you can create a time axis containing only the time spans of interest. To do that, subclass this class and override the generateTicks method.

The other alternative is to call the filterBy method, passing a function to it which should return false if the time tick should be filtered out. Calling clearFilters will return you to a full time axis.

Configs

60

Common

autoCommitStoreCRUD
dataStore
fieldsStore
groupersStoreGroup
idStore
listenersEvents
sortersStoreSort

Other

autoAdjust: Boolean= true

Automatically adjust the timespan when generating ticks with generateTicks according to the viewPreset configuration. Setting this to false may lead to shifting time/date of ticks.

continuous: Boolean= true

Set to false if the timeline is not continuous, e.g. the next timespan does not start where the previous ended (for example skipping weekends etc).

Method generating the ticks for this time axis. Should return a non-empty array of ticks. Each tick is an object of the following structure:

{
   startDate : ..., // start date
   endDate   : ...  // end date
}

To see it in action please check out our TimeAxis example and navigate to "Compressed non-working time" tab.

ParameterTypeDescription
axisStartDateDate

The start date of the interval

axisEndDateDate

The end date of the interval

unitDurationUnit

The unit of the time axis

incrementNumber

The increment for the unit specified.

Returns: TimeSpanConfig[] -

ticks The ticks representing the time axis

include: Object

Include only certain hours or days in the time axis (makes it continuous : false). Accepts and object with day and hour properties:

const scheduler = new Scheduler({
    timeAxis : {
        include : {
             // Do not display hours after 17 or before 9 (only display 9 - 17). The `to´ value is not
             // included in the time axis
             hour : {
                 from : 9,
                 to   : 17
             },
             // Do not display sunday or saturday
             day : [0, 6]
        }
    }
}

In most cases we recommend that you use Scheduler's workingTime config instead. It is easier to use and makes sure all parts of the Scheduler gets updated.

useSparseIndexStoreSparseIndex

Advanced

stmStoreStm
storageStore
useLocaleSortStoreSort

Chained store

chainedFieldsStoreChained
chainedFilterFnStoreChained
chainFiltersStoreChained
dontRelayToMasterStoreChained
doRelayToMasterStoreChained
ignoreLinkRecordsStoreChained
masterStoreStoreChained
syncOrderStoreChained
syncSortStoreChained

Filtering

filtersStoreFilter
remoteFilterStoreFilter

Misc

Paging

pageParamNameStorePaging
pageSizeStorePaging
remotePagingStorePaging

Records

Remote

filterParamNameStoreFilter

Sorting

remoteSortStoreSort
sortParamNameStoreSort

Tree

treeStore

Properties

70

Common

idStore

Class hierarchy

isTimeAxis: Boolean= truereadonly
Identifies an object as an instance of TimeAxis class, or subclass thereof.
isTimeAxis: Boolean= truereadonlystatic
Identifies an object as an instance of TimeAxis class, or subclass thereof.
isEventsEvents
isStoreStore
isStoreChainedStoreChained
isStoreChangesStoreChanges
isStoreCRUDStoreCRUD
isStoreFilterStoreFilter
isStoreGroupStoreGroup
isStorePagingStorePaging
isStoreRelationStoreRelation
isStoreSearchStoreSearch
isStoreSortStoreSort
isStoreSparseIndexStoreSparseIndex
isStoreStateStoreState
isStoreStmStoreStm
isStoreSumStoreSum
isStoreSyncStoreSync
isStoreTreeStoreTree

Other

endDate: Date

The current end date of the time axis. {@note}This is after filtering for workingTime and so may not be the same as the configured start date.{/note}

Method generating the ticks for this time axis. Should return an array of ticks . Each tick is an object of the following structure:

{
   startDate : ..., // start date
   endDate   : ...  // end date
}

Take notice, that this function either has to be called with start/end parameters, or create those variables.

To see it in action please check out our TimeAxis example and navigate to "Compressed non-working time" tab.

ParameterTypeDescription
axisStartDateDate

The start date of the interval

axisEndDateDate

The end date of the interval

unitDurationUnit

The unit of the time axis

incrementNumber

The increment for the unit specified.

Returns: Array | undefined -

ticks The ticks representing the time axis, or no return value to use the default tick generation

isContinuous: Boolean

Returns true if the time axis is continuous (will return false when filtered)

startDate: Date

The current start date of the time axis. {@note}This is after filtering for workingTime and so may not be the same as the configured start date.{/note}

Returns the ticks of the timeaxis in an array of objects with a "startDate" and "endDate".

unfilteredEndDate: Datereadonly

The configured end date of the time axis before workingTime filtering

unfilteredStartDate: Datereadonly

The configured start date of the time axis before workingTime filtering

Get the currently used time unit for the ticks

Get/set currently used preset

currentPageStorePaging
jsonStore
storesstaticStore

Advanced

isChainedStoreChained
StopBranchstaticStoreTree

Filtering

Lifecycle

configBase

Misc

Paging

isPagedStorePaging
lastPageStorePaging
pageSizeStorePaging

Records

autoCommitStoreCRUD
changesStoreCRUD
countStore
dataStore
firstStore
hasChangesStoreCRUD
lastStore
recordsStore

Sort, group & filter

filtersStoreFilter
groupersStoreGroup
isFilteredStoreFilter
isGroupedStoreGroup
isSortedStoreSort
sortersStoreSort

Tree

isTreeStoreTree
leavesStoreTree

Functions

106

Other

Returns true if the passed date is inside the span of the current time axis.

ParameterTypeDescription
dateDate

The date to query for

Returns: Boolean -

true if the date is part of the time axis

Filter the time axis by a function (and clears any existing filters first). The passed function will be called with each tick in time axis. If the function returns true, the 'tick' is included otherwise it is filtered. If all ticks are filtered out the time axis is considered invalid, triggering invalidFilter and then removing the filter.

ParameterTypeDescription
fnfunction

The function to be called, it will receive an object with startDate/endDate properties, and index of the tick.

thisObjObject

this reference for the function

Gets the time represented by a tick "coordinate".

ParameterTypeDescription
tickNumber

the tick "coordinate"

roundingMethodfloor | round | ceil

Rounding method to use. 'floor' to take the tick (lowest header in a time axis) start date, 'round' to round the value to nearest increment or 'ceil' to take the tick end date

Returns: Date -

The date to represented by the tick "coordinate", or null if invalid.

Gets a tick "coordinate" representing the date position on the timescale. Returns -1 if the date is not part of the time axis.

ParameterTypeDescription
dateDate

the date

Returns: Number -

the tick position on the scale or -1 if the date is not part of the time axis

Changes the time axis timespan to the supplied start and end dates.

Note This does not preserve the temporal scroll position. You may use setTimeSpan to set the time axis and maintain temporal scroll position (if possible).

ParameterTypeDescription
newStartDateDate

The new start date

newEndDateDate

The new end date

Moves the time axis by the passed amount and unit.

NOTE: When using a filtered TimeAxis the result of shift() cannot be guaranteed, it might shift into a filtered out span. It tries to be smart about it by shifting from unfiltered start and end dates. If that solution does not work for your filtering setup, please call setTimeSpan directly instead.

ParameterTypeDescription
amountNumber

The number of units to jump

unitString

The unit (Day, Week etc)

Moves the time axis forward in time in units specified by the view preset shiftUnit, and by the amount specified by the shiftIncrement config of the current view preset.

NOTE: When using a filtered TimeAxis the result of shiftNext() cannot be guaranteed, it might shift into a filtered out span. It tries to be smart about it by shifting from unfiltered start and end dates. If that solution does not work for your filtering setup, please call setTimeSpan directly instead.

ParameterTypeDescription
amountNumber

The number of units to jump forward

Moves the time axis backward in time in units specified by the view preset shiftUnit, and by the amount specified by the shiftIncrement config of the current view preset.

NOTE: When using a filtered TimeAxis the result of shiftPrev() cannot be guaranteed, it might shift into a filtered out span. It tries to be smart about it by shifting from unfiltered start and end dates. If that solution does not work for your filtering setup, please call setTimeSpan directly instead.

ParameterTypeDescription
amountNumber

The number of units to jump backward

Returns true if the passed timespan is part of the current time axis (in whole or partially).

ParameterTypeDescription
startDate

The start date

endDate

The end date

Returns: Boolean -

true if the timespan is part of the timeaxis

getStorestaticStore
onEvents
relayAllEvents
toJSONStore
triggerEvents
unEvents

Chained store

chainStoreChained
chainTreeStoreChained
fillFromMasterStoreChained

Configuration

applyDefaultsstaticBase

CRUD

addStoreCRUD
applyChangesetStoreChanges
commitStoreCRUD
insertStoreCRUD
loadPageStorePaging
moveStoreCRUD
nextPageStorePaging
previousPageStorePaging
removeStoreCRUD
removeAllStoreCRUD
revertChangesStoreCRUD

Events

Iteration

everyStore
flatMapStore
forEachStore
mapStore
reduceStore

Lifecycle

destroystaticBase

Misc

initClassstaticBase
isOfTypeNamestaticBase
mixinstaticBase

Records

getAtStore
getByIdStore
indexOfStore

Search

findStoreSearch
findByFieldStoreSearch
findRecordStoreSearch
queryStoreSearch
searchStoreSearch
someStoreSearch

Sort, group & filter

addFilterStoreFilter
addSorterStoreSort
clearFiltersStoreFilter
clearGroupersStoreGroup
clearSortersStoreSort
filterStoreFilter
getGroupRecordsStoreGroup
getGroupTitlesStoreGroup
groupStoreGroup
isRecordInGroupStoreGroup
removeFilterStoreFilter
removeSorterStoreSort
setGroupersStoreGroup
sortStoreSort

Sum

averageStoreSum
groupSumStoreSum
maxStoreSum
minStoreSum
sumStoreSum

Traverse

getNextStore
getPrevStore

Tree

getChildrenStoreTree
indentStoreTree
loadChildrenStoreTree
outdentStoreTree

Values

Events

37

Fires before the timeaxis is about to be reconfigured (e.g. new start/end date or unit/increment). Return false to abort the operation.

// Adding a listener using the "on" method
timeAxis.on('beforeReconfigure', ({ source, startDate, endDate }) => {

});
ParameterTypeDescription
sourceTimeAxis

The time axis instance

startDateDate

The new time axis start date

endDateDate

The new time axis end date

Fires if all the ticks in the timeaxis are filtered out. After firing the filter is temporarily disabled to return the time axis to a valid state. A disabled filter will be re-enabled the next time ticks are regenerated

// Adding a listener using the "on" method
timeAxis.on('invalidFilter', ({ source }) => {

});
ParameterTypeDescription
sourceTimeAxis

The time axis instance

Fires when the timeaxis has been reconfigured (e.g. new start/end date or unit/increment)

// Adding a listener using the "on" method
timeAxis.on('reconfigure', ({ source }) => {

});
ParameterTypeDescription
sourceTimeAxis

The time axis instance

addStoreCRUD
beforeAddStoreCRUD
beforeCommitStoreCRUD
beforeFilterStoreFilter
beforeIndentStoreTree
beforeLoadPageStorePaging
beforeOutdentStoreTree
beforeRemoveStoreCRUD
beforeSortStoreSort
catchAllEvents
changeStore
commitStoreCRUD
destroyEvents
filterStoreFilter
groupStoreGroup
indentStoreTree
loadPageStorePaging
moveStore
outdentStoreTree
refreshStore
removeStoreCRUD
removeAllStoreCRUD
sortStoreSort
updateStore

Event handlers

37

Called before the timeaxis is about to be reconfigured (e.g. new start/end date or unit/increment). Return false to abort the operation.

new TimeAxis({
    onBeforeReconfigure({ source, startDate, endDate }) {

    }
});
ParameterTypeDescription
sourceTimeAxis

The time axis instance

startDateDate

The new time axis start date

endDateDate

The new time axis end date

Called if all the ticks in the timeaxis are filtered out. After firing the filter is temporarily disabled to return the time axis to a valid state. A disabled filter will be re-enabled the next time ticks are regenerated

new TimeAxis({
    onInvalidFilter({ source }) {

    }
});
ParameterTypeDescription
sourceTimeAxis

The time axis instance

Called when the timeaxis has been reconfigured (e.g. new start/end date or unit/increment)

new TimeAxis({
    onReconfigure({ source }) {

    }
});
ParameterTypeDescription
sourceTimeAxis

The time axis instance

onAddStoreCRUD
onBeforeAddStoreCRUD
onBeforeFilterStoreFilter
onBeforeLoadPageStorePaging
onBeforeSortStoreSort
onCommitStoreCRUD
onDestroyEvents
onFilterStoreFilter
onGroupStoreGroup
onIndentStoreTree
onLoadPageStorePaging
onMoveStore
onOutdentStoreTree
onRemoveStoreCRUD
onRemoveAllStoreCRUD
onSortStoreSort

Typedefs

8