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.

// Filter out weekends from the time axis
scheduler.timeAxis.filterBy(tick => tick.startDate.getDay() !== 0 && tick.startDate.getDay() !== 6);

// Restore the full time axis
scheduler.timeAxis.clearFilters();

Useful configs and functions

Member	Description
continuous	Set `false` for non-continuous timelines
include	Include only certain hours or days
autoAdjust	Auto-adjust timespan when generating ticks
generateTicks	Custom tick generation method
reconfigure	Fires after time axis is reconfigured
beforeReconfigure	Fires before reconfiguration

Configs

Configs are options you supply in a configuration object when creating an instance of this class

autoAdjust : Booleantrue

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 : Booleantrue

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).
generateTicks : Function
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.
Parameters
- axisStartDate : Date
  
  The start date of the interval
- axisEndDate : Date
  
  The end date of the interval
- unit : DurationUnit
  
  The unit of the time axis
- increment : Number
  
  The increment for the unit specified.
Returns

TimeSpanConfig
:

ticks The ticks representing the time axis
Has a corresponding runtime generateTicks property.

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.

Properties

Properties are getters/setters or publicly accessible variables on this class

isTimeAxis : Booleantrue

READONLY

static

ADVANCED

Identifies an object as an instance of TimeAxis class, or subclass thereof.

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}
generateTicks : Function
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.

Has a corresponding generateTicks config.
isContinuous : Boolean

READONLY

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}
ticks : TimeSpan[]

READONLY

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

READONLY

The configured end date of the time axis before workingTime filtering
unfilteredStartDate : Date

READONLY

The configured start date of the time axis before workingTime filtering
unit : DurationUnit

READONLY

Get the currently used time unit for the ticks
viewPreset : ViewPreset

Get/set currently used preset
visibleTickTimeSpan : Number

internal

READONLY

How many ticks are visible across the TimeAxis.

Usually, this is an integer because autoAdjust means that the start and end dates are adjusted to be on tick boundaries.
isTimeAxis : Booleantrue

READONLY

ADVANCED

Identifies an object as an instance of TimeAxis class, or subclass thereof.

Functions

Functions are methods available for calling on the class

dateInAxis( date )
: Boolean

Returns true if the passed date is inside the span of the current time axis.
filterBy( fn, thisObj )

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.
forEachAuxInterval( unit, increment1, iteratorFn, thisObj )

internal

Calls the supplied iterator function once per interval. The function will be called with four parameters, startDate endDate, index, isLastIteration.
getDateFromTick( tick, roundingMethod )
: Date

Gets the time represented by a tick "coordinate".
getTickFromDate( date )
: Number

Gets a tick "coordinate" representing the date position on the timescale. Returns -1 if the date is not part of the time axis.
reconfigure( config, suppressRefreshfalse )

private

Reconfigures the time axis based on the config object supplied and generates the new 'ticks'.
roundDate( )

private

Rounds the date to nearest unit increment
setTimeSpan( newStartDate, newEndDate )

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).
shift( amount, unit )

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.
shiftNext( amount )

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.
shiftPrevious( amount )

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.
timeSpanInAxis( start, end )
: Boolean

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

private

Caches ticks and start/end dates for faster processing during rendering of events.
validateTickCount( )

private

Checks if date range is in bounds of allowed and throws and exception if not

Events

Events are triggered for certain actions in this class and can be listened for to react to those actions in your code

beforeReconfigure

PREVENTABLE

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

private

Event that is triggered when we end reconfiguring and everything UI-related should be done
invalidFilter

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
reconfigure

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

Event handlers

Event handlers are callbacks called as a result of certain actions in this class

onBeforeReconfigure

PREVENTABLE

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

private

Event that is called when we end reconfiguring and everything UI-related should be done
onInvalidFilter

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
onReconfigure

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

Source path

Scheduler/data/TimeAxis.js

TimeAxis

Useful configs and functions

See also

Configs

Parameters

Returns

Properties

Functions

Events

Event handlers

Source path

Inheritance tree3

Mixins16

Contents