Timeline Examples

This page contains examples which show how to use Timeline. For the documentation, please click the button below:

View docs

basic usage

basic usage

interaction

animate window
click to use
event listeners
limit move and zoom of the window
navigation menu
rolling mode
set selection
Sequential Selection
specific selectable items

editing

custom snapping of items
editing items
editing items, manipulate using callbacks
individually editable items
override editable items
tooltip on item change
update data on event

items

background areas
background areas with groups
expected vs actual times items
HTML contents
Item ordering
point items
range overflow
Tooltips
Tooltip Template
Dynamic Content

groups

groups
editable groups
ordering of groups
nested groups
nested three levels
subgroups
hide vertical items
visible groups
subgroup visibility

styling

axis orientation
custom CSS
grid styling
item class names
item templates
week styling

data handling

data serialization
load external data

other

clustering
custom time bars
custom time bars with tooltips
data attributes
all data attributes
Drag and Drop
label formats function
performance of groups
hiding periods
horizontal scroll
loading screen
localization
localization with custom languages
onTimeout
performance
right to left (rtl)
stress performance
timezone
React example
React 15 and less
React 16
vertical scroll
require.js example