Handled Events
KronoGraph lets you respond to the following events that get fired by the timeline. For more detail, see the Using Event Handlers section.
Fires when the current annotations change.
Parameters
- event required
AnnotationsEvent- 'auto' - The event was triggered by internal KronoGraph state.
- 'user' - The event was triggered by user action.
annotations
required{ [id: string]: Annotation }The current set of annotations.
why
requiredChangeReasonThe reason this event was fired:
Fires when the user clicks or taps on the timeline.
Default actions:
- Focus control - Focuses or unfocuses the entity row.
- Pin control - Pins or unpins the entity row.
- Annotation delete control - Deletes the annotation.
Parameters
- event required
ClickEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires on a right click or a long press on the timeline.
Default action:
- Suppresses the click event.
Parameters
- event required
ContextMenuEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires on a double click or a double tap on the timeline.
Default actions:
- On the background - Unfocuses any focused entity rows.
- On an entity row - Focuses or unfocuses the entity row.
- On the scale - Sets the timeline range to the
startTimeandendTimeproperties of the selected scale item.
Parameters
- event required
DoubleClickEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires when the drag is finished and pointer is released, or when the drag is canceled. On touch devices this fires when the finger or pointing device is lifted.
Default action:
- On
MarqueeRangedrag type - the timeline will zoom into the selected range.
Parameters
- event required
DragEndEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
'annotationScrollBar' | 'labelAreaWidth' | 'lensScrollbar' | 'marqueeRange' | 'marqueeSelection' | 'moveAnnotation' | 'pan' | nullThe type of drag.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
The entity range within the dragged area. Only present when dragType is 'marqueeSelection'.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires continuously as the cursor moves during a drag.
Parameters
- event required
DragMoveEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
'annotationScrollBar' | 'labelAreaWidth' | 'lensScrollbar' | 'marqueeRange' | 'marqueeSelection' | 'moveAnnotation' | 'pan' | nullThe type of drag.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires when a drag is started. Use setDragOptions to set the dragging behavior.
Default actions:
- On the background - Pans the timeline.
- On the scale - Draws a marquee range. On
drag-end, the default action is to zoom into the selected range. - On the entity label area border - Adjusts the label area width.
Parameters
- event required
DragStartEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
'annotationScrollBar' | 'labelAreaWidth' | 'lensScrollbar' | 'marqueeRange' | 'marqueeSelection' | 'moveAnnotation' | 'pan' | nullThe type of drag.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
Controls the dragging behavior.
Parameters
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires each time the timeline is drawn. The handler for this event is not passed any arguments.
Fires when the list of selected entities changes.
Parameters
- event required
EntitySelectionChangeEvent- 'auto' - The event was triggered by internal KronoGraph state.
- 'user' - The event was triggered by user action.
entitySelection
requiredstring[]The ids of all the selected entities.
why
requiredChangeReasonThe reason this event was fired:
Fires when the list of selected events changes.
Parameters
- event required
EventSelectionChangeEvent- 'auto' - The event was triggered by internal KronoGraph state.
- 'user' - The event was triggered by user action.
eventSelection
requiredstring[]The ids of the selected events.
why
requiredChangeReasonThe reason this event was fired:
Fires when the set of entities whose rows are to be expanded (if space allows) changes.
Parameters
- event required
ExpandedRowsEvent- 'auto' - The event was triggered by internal KronoGraph state.
- 'user' - The event was triggered by user action.
mode
required'auto' | 'manual'The mode used to determine which entity rows to expand (if space allows).
expandedRowIds
requiredstring[]The ids of the entities whose rows are to be expanded (if space).
why
requiredChangeReasonThe reason this event was fired:
Fires when the list of focused items changes.
Fires when the list of highlighted items changes.
Fires when the user hovers over the timeline. Pass the hover property to the options() function to configure the hover delay.
Parameters
- event required
HoverEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires when the user presses a key.
Default actions:
- Escape key - Cancels an active drag.
- Shift key - Draws a marquee range when dragging.
Parameters
- event required
KeyDownEvent
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
keyCode
requirednumberThe keyCode of the key pressed.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
If called, the default action is prevented.
Returns void
Fires when the user releases a key.
Parameters
- event required
KeyUpEvent
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
keyCode
requirednumberThe keyCode of the key pressed.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
If called, the default action is prevented.
Returns void
Fires when the entity at the center of the lens changes, for example, when the user scrolls through lens view.
Parameters
Fires when an entity is pinned or unpinned.
Fires when a pointer presses down on the timeline.
Parameters
- event required
PointerDownEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires continuously as the pointer moves on the timeline, or the timeline moves beneath the pointer.
Default action:
- On an entity row - Highlights the entity row and displays available controls (pin or focus).
- On a time series chart - Highlights the nearest data point.
Parameters
- event required
PointerMoveEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires when the pointer is released.
Parameters
- event required
PointerUpEvent
button
requirednumberThe index of the button used.
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
numberThe number of nanoseconds to add to endTime.
DateThe end of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
string[]An array of ids of events within the targeted item. Only defined if targetType is event, eventSummary or cell.
id
requiredstring | nullThe id of the targeted item.
stringThe label of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
pointerId
requirednumberThe unique identifier of the pointer.
pointerType
requiredstringThe type of pointing device: mouse, touch or pen.
If called, the default action is prevented.
Returns void
numberThe number of nanoseconds to add to startTime.
DateThe start of the time range covered by the targeted item. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
An object containing details of the sub-item, or undefined if the cursor is not over a sub-item.
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
DateThe timeline time corresponding to the pointer position. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
numberThe number of nanoseconds to add to time.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.
Fires when the time range shown in the timeline changes.
Parameters
- event required
RangeEvent- 'auto' - The event was triggered by internal KronoGraph state.
- 'user' - The event was triggered by user action.
start
requiredDateThe time at the start of the timeline after the range has changed as a Date in local time. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
startNanoseconds
requirednumberThe number of nanoseconds to add to the start time.
end
requiredDateThe time at the end of the timeline after the range has changed as a Date in local time. When the scale is wrapped, this is relative to the base range - see Scale Wrapping.
endNanoseconds
requirednumberThe number of nanoseconds to add to the end time.
why
requiredChangeReasonThe reason this event was fired:
Fires continuously while the user is vertically or horizontally scrolling.
Default actions:
- Vertical scrolling on the background - Zooms the timeline.
- Vertical scrolling on the entity label area - Scrolls lens view up or down.
- Horizontal scrolling - Pans the timeline.
Parameters
- event required
WheelEvent
defaultPrevented
requiredbooleanA read-only value indicating whether the default action was prevented.
deltaMode
requirednumberThe unit of measurement for the delta value.
deltaX
requirednumberThe number of units that the wheel scrolled in the x direction.
deltaY
requirednumberThe number of units that the wheel scrolled in the y direction.
id
requiredstring | nullThe id of the targeted item.
modifierKeys
requiredAn object describing which modifier keys were pressed when the event occurred.
If called, the default action is prevented.
Returns void
targetType
required'annotationBody' | 'annotationDeleteButton' | 'annotationEditButton' | 'annotation' | 'cell' | 'entity' | 'entityGroup' | 'entityRun' | 'event' | 'eventSummary' | 'eventLabel' | 'focus' | 'fold' | 'foldControl' | 'glyph' | 'labelAreaBorder' | 'lensControl' | 'lensScrollbar' | 'pin' | 'scale' | 'timeSeriesChart' | nullThe type of the targeted item.
x
requirednumberThe distance from the left edge of the Timeline element to the pointer position.
y
requirednumberThe distance from the top edge of the Timeline element to the pointer position.