Search

Time Bar Events

Events let you customise your application by responding to user actions on the time bar surface. To attach handlers to events, use timebar.on().

Fires when any event occurs on the time bar. It returns an object containing both the name of the event and the object returned by that event.

Default action: None

Parameters

props
required
TimeBarAllEvent
TimeBarAllEventProps

The object returned by the event when listened to directly.

name

required
string

The name of the event.

The change event fires when the time range is changed, either by the user or programmatically. To get the new range, use the range() function.

The event also fires when the time bar data is changed but only if the change affects the current range.

Default action: None

Parameters

event
required
TimeBarChangeEventProps

type

required
TimeBarChangeType

The click event fires on a click or tap.

Default actions:

  • On a control button: Performs the button action.

Parameters

event
required
TimeBarPointerEventProps

button

required
number

The index of the button used.

boolean

If the default action was prevented.

Index of clicked group within bar.

number[]

Value of each group within bar.

number

The index of the selection clicked on, or null for other click types.

A dictionary detailing which modifier keys were pressed when the event occurred.

pointerId

required
number

The unique identifier of the pointer.

pointerType

required
string

The type of pointing device as returned by the browser. The standard values are 'mouse', 'touch' and 'pen'.

Call to prevent the event's default action.

Returns void

The upper bound of the time at the pointer.

The lower bound of the time at the pointer.

tooltipX

required
number

A suggested location for the tooltip in the x direction - the centre of the bar or selection point.

tooltipY

required
number

A suggested location for the tooltip in the y direction - the height of the bar or selection point.

type

required
TimeBarItemId

The type of clicked item:

  • 'area' - the area under the curve when in area mode
  • 'bar' - a histogram bar
  • 'selection' - a selection line point
  • 'scale' - the time axis scale
  • 'histo' - the histogram area between the sliders
  • 'left', 'right' - sliders
  • 'slider' - the areas outside the current slider range
  • 'controlbar' - the control bar at the bottom of the time bar
  • 'fit', 'previous', 'next', 'play', 'playextend', 'zoomin', 'zoomout' - control bar controls
  • null - if there is nothing under the pointer
number

The value of either the bar or selection, or null for other click types.

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

The context-menu event fires on a right click or long press for touch devices.

Default action: Suppresses the click event.

Parameters

event
required
TimeBarPointerEventProps

button

required
number

The index of the button used.

boolean

If the default action was prevented.

Index of clicked group within bar.

number[]

Value of each group within bar.

number

The index of the selection clicked on, or null for other click types.

A dictionary detailing which modifier keys were pressed when the event occurred.

pointerId

required
number

The unique identifier of the pointer.

pointerType

required
string

The type of pointing device as returned by the browser. The standard values are 'mouse', 'touch' and 'pen'.

Call to prevent the event's default action.

Returns void

The upper bound of the time at the pointer.

The lower bound of the time at the pointer.

tooltipX

required
number

A suggested location for the tooltip in the x direction - the centre of the bar or selection point.

tooltipY

required
number

A suggested location for the tooltip in the y direction - the height of the bar or selection point.

type

required
TimeBarItemId

The type of clicked item:

  • 'area' - the area under the curve when in area mode
  • 'bar' - a histogram bar
  • 'selection' - a selection line point
  • 'scale' - the time axis scale
  • 'histo' - the histogram area between the sliders
  • 'left', 'right' - sliders
  • 'slider' - the areas outside the current slider range
  • 'controlbar' - the control bar at the bottom of the time bar
  • 'fit', 'previous', 'next', 'play', 'playextend', 'zoomin', 'zoomout' - control bar controls
  • null - if there is nothing under the pointer
number

The value of either the bar or selection, or null for other click types.

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

The double-click event fires on a double click or double tap.

Default action: Zooms in and centres at the clicked time (animated).

Parameters

event
required
TimeBarPointerEventProps

button

required
number

The index of the button used.

boolean

If the default action was prevented.

Index of clicked group within bar.

number[]

Value of each group within bar.

number

The index of the selection clicked on, or null for other click types.

A dictionary detailing which modifier keys were pressed when the event occurred.

pointerId

required
number

The unique identifier of the pointer.

pointerType

required
string

The type of pointing device as returned by the browser. The standard values are 'mouse', 'touch' and 'pen'.

Call to prevent the event's default action.

Returns void

The upper bound of the time at the pointer.

The lower bound of the time at the pointer.

tooltipX

required
number

A suggested location for the tooltip in the x direction - the centre of the bar or selection point.

tooltipY

required
number

A suggested location for the tooltip in the y direction - the height of the bar or selection point.

type

required
TimeBarItemId

The type of clicked item:

  • 'area' - the area under the curve when in area mode
  • 'bar' - a histogram bar
  • 'selection' - a selection line point
  • 'scale' - the time axis scale
  • 'histo' - the histogram area between the sliders
  • 'left', 'right' - sliders
  • 'slider' - the areas outside the current slider range
  • 'controlbar' - the control bar at the bottom of the time bar
  • 'fit', 'previous', 'next', 'play', 'playextend', 'zoomin', 'zoomout' - control bar controls
  • null - if there is nothing under the pointer
number

The value of either the bar or selection, or null for other click types.

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

The drag-end event fires when the drag is finished and the pointer released, or when the drag is cancelled. On touch devices this fires when the finger or input device is lifted from surface.

Default action:

  • On the background: Accepts the final panned range of the time bar.
  • On the slider: Accepts the final range of the time bar and zooms to fit the view.

Parameters

event
required
TimeBarPointerEventProps

button

required
number

The index of the button used.

boolean

If the default action was prevented.

Index of clicked group within bar.

number[]

Value of each group within bar.

number

The index of the selection clicked on, or null for other click types.

A dictionary detailing which modifier keys were pressed when the event occurred.

pointerId

required
number

The unique identifier of the pointer.

pointerType

required
string

The type of pointing device as returned by the browser. The standard values are 'mouse', 'touch' and 'pen'.

Call to prevent the event's default action.

Returns void

The upper bound of the time at the pointer.

The lower bound of the time at the pointer.

tooltipX

required
number

A suggested location for the tooltip in the x direction - the centre of the bar or selection point.

tooltipY

required
number

A suggested location for the tooltip in the y direction - the height of the bar or selection point.

type

required
TimeBarItemId

The type of dragged item:

  • 'area' - the area under the curve when in area mode
  • 'bar' - a histogram bar
  • 'selection' - a selection line point
  • 'scale' - the time axis scale
  • 'histo' - the histogram area between the sliders
  • 'left', 'right' - sliders
  • 'slider' - the areas outside the current slider range
  • 'controlbar' - the control bar at the bottom of the time bar
  • 'fit', 'previous', 'next', 'play', 'playextend', 'zoomin', 'zoomout' - control bar controls
  • null - if there is nothing under the pointer
number

The value of either the bar or selection, or null for other click types.

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

The drag-start event fires when a drag is started.

Default action:

  • On the background: Starts a pan controlled by the pointer.
  • On the slider: Starts dragging the slider.

Parameters

event
required
TimeBarPointerEventProps

button

required
number

The index of the button used.

boolean

If the default action was prevented.

Index of clicked group within bar.

number[]

Value of each group within bar.

number

The index of the selection clicked on, or null for other click types.

A dictionary detailing which modifier keys were pressed when the event occurred.

pointerId

required
number

The unique identifier of the pointer.

pointerType

required
string

The type of pointing device as returned by the browser. The standard values are 'mouse', 'touch' and 'pen'.

Call to prevent the event's default action.

Returns void

The upper bound of the time at the pointer.

The lower bound of the time at the pointer.

tooltipX

required
number

A suggested location for the tooltip in the x direction - the centre of the bar or selection point.

tooltipY

required
number

A suggested location for the tooltip in the y direction - the height of the bar or selection point.

type

required
TimeBarItemId

The type of dragged item:

  • 'area' - the area under the curve when in area mode
  • 'bar' - a histogram bar
  • 'selection' - a selection line point
  • 'scale' - the time axis scale
  • 'histo' - the histogram area between the sliders
  • 'left', 'right' - sliders
  • 'slider' - the areas outside the current slider range
  • 'controlbar' - the control bar at the bottom of the time bar
  • 'fit', 'previous', 'next', 'play', 'playextend', 'zoomin', 'zoomout' - control bar controls
  • null - if there is nothing under the pointer
number

The value of either the bar or selection, or null for other click types.

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

The end event fires when the end data point is reached.

Default action: None

Parameters

event
required
EndEventProps

type

required
"data" | "range"

The type of end reached:

  • 'range' - left slider reaching the right-most data point
  • 'data' - right slider reaching the right-most data point

The hover event fires when the cursor hovers over an item. The event only fires once when the type of the hover target changes.

Default action: None

Parameters

event
required
TimeBarPointerEventProps

button

required
number

The index of the button used.

boolean

If the default action was prevented.

Index of clicked group within bar.

number[]

Value of each group within bar.

number

The index of the selection clicked on, or null for other click types.

A dictionary detailing which modifier keys were pressed when the event occurred.

pointerId

required
number

The unique identifier of the pointer.

pointerType

required
string

The type of pointing device as returned by the browser. The standard values are 'mouse', 'touch' and 'pen'.

Call to prevent the event's default action.

Returns void

The upper bound of the time at the pointer.

The lower bound of the time at the pointer.

tooltipX

required
number

A suggested location for the tooltip in the x direction - the centre of the bar or selection point.

tooltipY

required
number

A suggested location for the tooltip in the y direction - the height of the bar or selection point.

type

required
TimeBarItemId

The type of hovered item:

  • 'area' - the area under the curve when in area mode
  • 'bar' - a histogram bar
  • 'selection' - a selection line point
  • 'scale' - the time axis scale
  • 'histo' - the histogram area between the sliders
  • 'left', 'right' - sliders
  • 'slider' - the areas outside the current slider range
  • 'controlbar' - the control bar at the bottom of the time bar
  • 'fit', 'previous', 'next', 'play', 'playextend', 'zoomin', 'zoomout' - control bar controls
  • null - if there is nothing under the pointer
number

The value of either the bar or selection, or null for other click types.

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

The key-down event fires when the user presses a key.

Default actions:

  • Space key: Toggles Play/Pause buttons

Parameters

event
required
KeyboardEventProps
boolean

If the default action was prevented.

keyCode

required
number

The keyCode of the key pressed.

A dictionary detailing which modifier keys were pressed when the event occurred.

Call to prevent the event's default action.

Returns void

The key-up event fires when the user releases a key.

Default action: None

Parameters

event
required
KeyboardEventProps
boolean

If the default action was prevented.

keyCode

required
number

The keyCode of the key pressed.

A dictionary detailing which modifier keys were pressed when the event occurred.

Call to prevent the event's default action.

Returns void

The pause event fires when the time bar is paused.

The event also fires when pausing the time bar programmatically.

Default action: None

Parameters

event
required
PauseEventProps

The play event fires when the time bar starts to play.

The event also fires when playing the time bar programmatically.

Default action: None

Parameters

event
required
PlayEventProps

type

required
"normal" | "extend"

The type of play mode.

The pointer-down event fires when a pointer presses down on the surface.

Default action: None

Parameters

event
required
TimeBarPointerEventProps

button

required
number

The index of the button used.

boolean

If the default action was prevented.

Index of clicked group within bar.

number[]

Value of each group within bar.

number

The index of the selection clicked on, or null for other click types.

A dictionary detailing which modifier keys were pressed when the event occurred.

pointerId

required
number

The unique identifier of the pointer.

pointerType

required
string

The type of pointing device as returned by the browser. The standard values are 'mouse', 'touch' and 'pen'.

Call to prevent the event's default action.

Returns void

The upper bound of the time at the pointer.

The lower bound of the time at the pointer.

tooltipX

required
number

A suggested location for the tooltip in the x direction - the centre of the bar or selection point.

tooltipY

required
number

A suggested location for the tooltip in the y direction - the height of the bar or selection point.

type

required
TimeBarItemId

The type of item under the pointer:

  • 'area' - the area under the curve when in area mode
  • 'bar' - a histogram bar
  • 'selection' - a selection line point
  • 'scale' - the time axis scale
  • 'histo' - the histogram area between the sliders
  • 'left', 'right' - sliders
  • 'slider' - the areas outside the current slider range
  • 'controlbar' - the control bar at the bottom of the time bar
  • 'fit', 'previous', 'next', 'play', 'playextend', 'zoomin', 'zoomout' - control bar controls
  • null - if there is nothing under the pointer
number

The value of either the bar or selection, or null for other click types.

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

The pointer-move event fires continuously as the pointer moves on the surface.

Default action: None

Parameters

event
required
TimeBarPointerEventProps

button

required
number

The index of the button used.

boolean

If the default action was prevented.

Index of clicked group within bar.

number[]

Value of each group within bar.

number

The index of the selection clicked on, or null for other click types.

A dictionary detailing which modifier keys were pressed when the event occurred.

pointerId

required
number

The unique identifier of the pointer.

pointerType

required
string

The type of pointing device as returned by the browser. The standard values are 'mouse', 'touch' and 'pen'.

Call to prevent the event's default action.

Returns void

The upper bound of the time at the pointer.

The lower bound of the time at the pointer.

tooltipX

required
number

A suggested location for the tooltip in the x direction - the centre of the bar or selection point.

tooltipY

required
number

A suggested location for the tooltip in the y direction - the height of the bar or selection point.

type

required
TimeBarItemId

The type of item under the pointer:

  • 'area' - the area under the curve when in area mode
  • 'bar' - a histogram bar
  • 'selection' - a selection line point
  • 'scale' - the time axis scale
  • 'histo' - the histogram area between the sliders
  • 'left', 'right' - sliders
  • 'slider' - the areas outside the current slider range
  • 'controlbar' - the control bar at the bottom of the time bar
  • 'fit', 'previous', 'next', 'play', 'playextend', 'zoomin', 'zoomout' - control bar controls
  • null - if there is nothing under the pointer
number

The value of either the bar or selection, or null for other click types.

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

The pointer-up event fires when the pointer is released.

Default action: None

Parameters

event
required
TimeBarPointerEventProps

button

required
number

The index of the button used.

boolean

If the default action was prevented.

Index of clicked group within bar.

number[]

Value of each group within bar.

number

The index of the selection clicked on, or null for other click types.

A dictionary detailing which modifier keys were pressed when the event occurred.

pointerId

required
number

The unique identifier of the pointer.

pointerType

required
string

The type of pointing device as returned by the browser. The standard values are 'mouse', 'touch' and 'pen'.

Call to prevent the event's default action.

Returns void

The upper bound of the time at the pointer.

The lower bound of the time at the pointer.

tooltipX

required
number

A suggested location for the tooltip in the x direction - the centre of the bar or selection point.

tooltipY

required
number

A suggested location for the tooltip in the y direction - the height of the bar or selection point.

type

required
TimeBarItemId

The type of item under the pointer:

  • 'area' - the area under the curve when in area mode
  • 'bar' - a histogram bar
  • 'selection' - a selection line point
  • 'scale' - the time axis scale
  • 'histo' - the histogram area between the sliders
  • 'left', 'right' - sliders
  • 'slider' - the areas outside the current slider range
  • 'controlbar' - the control bar at the bottom of the time bar
  • 'fit', 'previous', 'next', 'play', 'playextend', 'zoomin', 'zoomout' - control bar controls
  • null - if there is nothing under the pointer
number

The value of either the bar or selection, or null for other click types.

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

The start event fires when the starting data point is reached.

Default action: None

Parameters

event
required
StartEventProps

type

required
"data" | "range"

The type of start reached:

  • 'range' - left slider reaching the left-most data point
  • 'data' - right slider reaching the left-most data point

The wheel event fires continuously while the user is rotating a mouse wheel or scrolling using a trackpad.

Default actions:

  • On the surface: Zooms in or out (animated)

Parameters

event
required
WheelEventProps
boolean

If the default action was prevented.

deltaMode

required
number

The unit of measurement for delta value:

  • 0: Pixels
  • 1: Lines
  • 2: Pages

deltaX

required
number

The number of units that the wheel scrolled in the x direction.

deltaY

required
number

The number of units that the wheel scrolled in the y direction.

A dictionary detailing which modifier keys were pressed when the event occurred.

Call to prevent the event's default action.

Returns void

x

required
number

The x location of the pointer in view coordinates.

y

required
number

The y location of the pointer in view coordinates.

Terms of use

These terms do not alter or supersede any existing agreements between you (or your employer) and us.

By accessing or using any Content you agree to be bound by these Terms of Use. Please review these terms carefully before using the website.

The contents of this website, including but not limited to any text, code samples, API references, schemas, interactive tools, and other materials (collectively, the 'Content'), are made available for informational and internal evaluation purposes only. All intellectual property rights in the Content are reserved. No licence is granted to use the Content for any commercial purpose, or to copy, distribute, modify, reverse-engineer, or incorporate any part of the Content into any product or service, without our prior written consent.

This Content is provided “as is” and “as available,” without any representations, warranties, or guarantees of any kind, whether express or implied, including but not limited to implied warranties of merchantability, fitness for a particular purpose, non-infringement, or accuracy. To the fullest extent permitted by applicable law, we expressly exclude and disclaim all implied warranties, conditions, and other terms that might otherwise be implied.

We disclaim all liability for any loss or damage, whether direct, indirect, incidental, consequential, or otherwise, arising from any reliance placed on the Content or from your use of it, to the fullest extent permitted by applicable law. By continuing to access or use the Content, you acknowledge and agree to these terms.