timeline.js

Draggable timeline.

Objects

OAT.Timeline(contentDiv, options)

Creates a Timeline inside contentDiv. The options may include:

• lineHeight - int, height of one record
• bandHeight - int, height of one band's header
• margins - int, (default 200)
• resize - bool (default true)
• formatter - bool (default true)
• sliderHeight - int, height of slider
• autoHeight - bool, should height be automatically adjusted? (default true)

Methods

OAT.Timeline.addBand(name, color, label)

Adds a data band to chart. The band is identified by name, drawn in color, and labeled with label.

OAT.Timeline.addEvent(bandName, startTime, endTime, content, color)

Adds new event to Timeline, respective to its bandb and Name.

• startTime and endTime are data-time strings formatted as YYYY-MM-DDThh-mm-ss. (*ToBeDone - verify preceding sentence!* )
• endTime can be false, when the event has no duration.
• content is a HTML element.
• coloris a background color for time strip (only when endTime is not false).

OAT.Timeline::draw()

Draws the timeline.

CSS Classes

OAT.Timeline.timeline

ToBeDone

OAT.Timeline.timeline_port

ToBeDone

OAT.Timeline.timeline_slider

ToBeDone

Example

ToBeDone