The theme controls the visual appearance of the timeline. The default theme is the ClassicTheme, which can be created with Timeline.getDefaultTheme(). The theme is set for each timeband separately by setting the theme parameter in Timeline.createBandInfo(params).
Offers reasonable defaults and is used as a basis for most if not all timeline examples.
Defaults to 0, which stands for Sunday.
Controls the Ether for this theme.
The color for the highlight, can be set to any value that is used in CSS, i.e. color names like "white", "red" as well as RGB values like "#6666cc" or "#66c".
The opacity of the highlight, which is a value between 0 (not visible) to 100 (full opacity).
Controls the appearance of events for this theme.
- The height of the track, measured in pixel.
- The gap between two tracks, measured in pixel.
- 20, // px
- 6, // px
- 2, // px
- 1 // px
Controls the appearance of instantaneous events. There are two type of such events, precise and imprecise events. Both types of events can be shown differently using the properties below:
- The URL of the icon that is shown for this event.
- The width of the icon in pixel.
- The height of the icon in pixel.
- The color in which the tape is drawn for imprecise events.
- The opacity of the tape for imprecise events.
The bubble is shown when the user clicks on an event. The following parameters control the bubble:
- The width of the bubble in pixel.
- The height of the bubble in pixel.
- titleStyler, bodyStyler, imageStyler, wikiStyler, timeStyler
- The five stylers are used to determine the CSS class for different parts of the bubble. Each styler is actually a method which has a DOM element as a parameter and sets the class name of this element to "timeline-event-bubble-<styler name>" where "<styler name>" must be replaced by "title", "body", "image", "wiki" and "time" respectively.