@fqqb/timeline

class TimeRuler extends Band

A ruler that interprets time as milliseconds since January 01, 1970, 00:00:00 UTC. Same as JavaScript Date.

Properties
background, borderColor, borderWidth, contentHeight, data, frozen, fullHeight, headerBackground, height, label, marginBottom, marginTop, scale, textColor, timeline, timezone, width, x, y
Methods
constructor, addHeaderClickListener, addMutationListener, beforeDraw, calculateContentHeight, createAnimatableProperty, disconnectedCallback, drawBandContent, drawContent, drawOverlay, drawUnderlay, removeHeaderClickListener, removeMutationListener, reportMutation

Properties

background
getset

Background of this band.

Type:
FillStyle
borderColor
getset

Border color of this band. If undefined, the color is determined by the property ‘bandBorderColor’ of the Timeline instance.

Type:
undefined | string
borderWidth
getset

Border width of this band. If undefined, the width is determined by the property ‘bandBorderWidth’ of the Timeline instance.

Type:
undefined | number
contentHeight
getset

The height of the band content (excluding margins).

Type:
number
Default value:
30
data
getset

Arbitrary data. For example an identifier of a backend system.

Type:
any
frozen
getset

If set to true, this band stays fixed on top, even while scrolling vertically.

Frozen bands precede non-frozen bands, regardless of the order in which bands were added.

Type:
boolean
fullHeight
getset
Type:
boolean
Default value:
false
headerBackground
getset

Background of the header of this band.

Type:
FillStyle
height
get

The height of this band.

Type:
number
label
getset

Human-friendly label for this band. Used in sidebar.

Type:
undefined | string
marginBottom
getset

Whitespace in points between the bottom of this band and band content.

Type:
number
marginTop
getset

Whitespace in points between the top of this band and band content.

Type:
number
scale
getset

The scale for this ruler. Scales render ticks and labels.

If undefined, an automatic scale is determined based on the visible time range.

Type:
ScaleKind
Default value:
'auto'
textColor
getset
Type:
string
Default value:
'grey'
timeline
get

Timeline instance that this instance is bound to.

Type:
Timeline
timezone
getset

Set the timezone by which to format scale labels. If undefined, the local timezone is used.

Type:
undefined | string
width
get

The width of this band.

Type:
number
x
get

The X-coordinate of this band.

Type:
number
y
get

The Y-coordinate of this band.

Type:
number

Methods

constructor(timeline)
Parameters:
  • Timeline timeline

    Timeline instance that this instance is bound to.

addHeaderClickListener(listener)

Register a listener that receives updates when a line header is clicked.

Parameters:
Return type:
void
addMutationListener(mutationListener)

Adds a listener that is notified whenever one of the properties changes.

This method is used by the Timeline instance to detect when to redraw the Canvas.

Parameters:
  • () => void mutationListener
Return type:
void
beforeDraw(g)

Gets called before any of the draw methods.

Parameters:
Return type:
void
calculateContentHeight(g)

Implementations should return required content height (excluding margins) during the current draw operation.

Parameters:
Return type:
number
createAnimatableProperty(value)

Creates an animatable property.

Animatable properties apply easing over time between numeric value changes.

Parameters:
  • number value –
Return type:
AnimatableProperty
disconnectedCallback()

Called when this drawable is removed from its Timeline

Return type:
void
drawBandContent(g)
Parameters:
Return type:
void
drawContent(g)

Draw regular content.

Parameters:
Return type:
void
drawOverlay(g)

Gets called after regular content is drawn. Override this if you need a top layer.

Parameters:
Return type:
void
drawUnderlay(g)

Gets called before regular content is drawn. Override this if you need a bottom layer.

Parameters:
Return type:
void
removeHeaderClickListener(listener)

Unregister a previously registered listener to stop receiving header click events.

Parameters:
Return type:
void
removeMutationListener(mutationListener)

Remove a previously added mutation listener.

Parameters:
  • () => void mutationListener
Return type:
void
reportMutation()

Mark this Drawable as dirty. This method is intended for use in subclasses and should be called in the implementation of set accessors.

Return type:
void

Drawables