Timeline Props
You can control the state, appearance and behavior of the timeline by setting the props below.
The timeline also supports standard element props - including id, className, and pointer events (such as onClick).
object A dictionary of annotations to be displayed in the timeline, where the keys are the annotation ids and the values are Annotation objects.
string If the timeline receives a className it will not apply its default style. We recommend styling the timeline's parent element, rather than passing a className to the timeline itself.
object A dictionary of entities to be displayed in the timeline, where the keys are the entity ids and the values are Entity objects. Ids must be unique across both entities and events.
string | string[] The id or ids of selected entities. These are displayed using selectionColor.
boolean Whether users are able to select entities by interacting with the timeline. See Select entities in the Interactions section.
object A dictionary of entity types, where the keys are the entity type names and the values are EntityType objects. May specify properties for the built-in 'default' entity type.
object A dictionary of events to be displayed in the timeline, where the keys are the event ids and the values are Event objects. Ids must be unique across both entities and events.
string | string[] The ids of the selected events. Selected events are drawn using selectionColor.
boolean Whether the timeline is in event selection mode.
object A dictionary of event types, where the keys are the event type names and the values are EventType objects. May specify properties for the 'default' event type.
The entities to be expanded by adding sub-rows (where space allows) to space out overlapping events vertically. See Expanded Rows.
string | string[] The id or ids of the events or entities to focus on. When the timeline is focused, only focused items and their connections are shown. Focused events will keep the entities they are linked to in focus. Focusing does not affect time series charts.
string | string[] The ids of the rows and entities to highlight. Highlighted entities and rows are drawn using highlightColor.
Sets the mode of calculation for the width of the label area and the width, if the mode is fixed.
string | null The id of the entity at the center of the lens, or null if lens view is not open.
The timeline markers drawn across the timeline at a specified time.
Defines options for the timeline.
'firstevent' | 'lastevent' | 'keyorder' | 'alphabetical' | 'shorteneventlines'
default: 'shorteneventlines' The ordering of entity groups, and entities within a group:
- 'alphabetical' - Order alphabetically by the first letter of the entity labels.
- 'firstevent' - Order by the time of the first event associated with the entity.
- 'lastevent' - Order by the time of the last event of each entity (ascending).
- 'keyorder' - Order by the indices of the entities data object.
- 'shorteneventlines' - Order to shorten the vertical event lines between entities.
{ids: string | string[], style: EntityStyle | EventStyle}[] Overrides the style properties set for an Entity or Event with EntityStyle or EventStyle , see Override Styles.
string[] The ids of entities that are pinned.
The range of time shown in the timeline.
string | string[] The ids of the events to reveal when the heatmap view is shown.
CSSProperties Standard styling properties for the element. We recommend styling the timeline's parent element, not the timeline itself. Default is: { position: 'relative', height: '100%', minHeight: '100px', width: '100%', }
object A dictionary of time series charts, where the keys are the time series chart ids and the values are TimeSeriesChart objects. Ids must be unique.
object A dictionary of time series chart stacks, where the keys are the time series chart stack ids and the values are TimeSeriesChartStack objects. Ids must be unique.