# Typedef

Static Public Summary
public | ColorScheme: Object An option to overwrite defaults UI color of all event nodes | since 2.0.0
public | Default: Object Default options for generating the timeline by the jQuery.Timeline plugin. | since 2.0.0
public | Effects: Object Various effect settings to the timeline object displayed in the DOM | since 2.0.0
public | EventColors: Object Color scheme to overwrite defaults UI color of the event node | since 2.0.0
public | EventMeta: Object | since 2.0.0
public | EventParams: Object The preset as default of event parameters on the timeline | since 2.0.0
public | Footer: Object | since 2.0.0
public | Headline: Object | since 2.0.0
public | LimitScaleGrids: Object The limited grid number per scale of timeline | since 2.0.0
public | LocaleOptions: Object In principle, this option conforms to the specification of options in "Date.prototype.toLocaleString()". |
public | RelationOption: Object |
public | Ruler: Object You can set the upper and lower ruler individually | since 2.0.0
public | RulerOptions: Object Can define the ruler position to top or bottom and both | since 2.0.0
public | Sidebar: Object | since 2.0.0
public | ThemeColors: Object Color scheme to overwrite defaults UI color of the timeline instance | since 2.1.0

## Static Public

### public ColorScheme: Object since 2.0.0 source

An option to overwrite defaults UI color of all event nodes

#### Properties:

Name | Type | Attribute | Description
theme | ThemeColors | optional | Color scheme to overwrite defaults UI color of the timeline instance
event | EventColors | optional | Color scheme to overwrite defaults UI color of the event node
hookEventColors | function | optional | You can declare a function to set colors with referring the data each event node

### public Default: Object since 2.0.0 source

Default options for generating the timeline by the jQuery.Timeline plugin. Those defaults are overridden to undefined settings of the timeline configuration.

#### Properties:

Name | Type | Attribute | Description
type | string | optional default: "bar" | View type of timeline event is either "bar" or "point" or "mixed"
scale | string | optional default: "day" | Timetable's minimum level scale is either "year", "month", "week", "day", "hour", "minute"
startDatetime | string | optional default: "currently" | Beginning date time of timetable on the timeline. format is ( "^d{4}(/|-)d{2}(/|-)d{2}\sd{2}:d{2}:d{2}$" ) or "currently"
endDatetime | string | optional default: "auto" | Ending date time of timetable on the timeline. format is ( "^d{4}(/|-)d{2}(/|-)d{2}\sd{2}:d{2}:d{2}$" ) or "auto"
headline | Headline | optional | Settings for the content customize in the headline
footer | Footer | optional | Settings for the content customize in the footer
range | number | string | optional default: 3 | Override the scale range of the timeline to be rendered when endDatetime is undefined or "auto"
sidebar | Sidebar | optional | Settings for the content of the sidebar
rows | number | string | optional default: "auto" | Rows of timeline event area
rowHeight | number | optional default: 48 | Height of one row
width | number | string | optional default: "auto" | Fixed width (pixel) of timeline view
height | number | string | optional default: "auto" | Fixed height (pixel) of timeline view; Defaults to ( rows * rowHeight )
minGridSize | number | optional default: 30 | Override value of minimum size (pixel) of timeline grid
marginHeight | number | optional default: 2 | Margin (pixel) top and bottom of events on the timeline
ruler | Ruler | optional | Settings of the ruler
rangeAlign | number | string | optional default: "latest" | Possible values are "left", "center", "right", "current", "latest" and specific event id
loader | string | optional default: "default" | Custom loader definition, possible values are "default", false and selector of loader element
hideScrollbar | boolean | optional default: false | Whether or not to display the scroll bar displayed when the width of the timeline overflows (even if it is set to non-display, it will not function depending on the browser)
eventMeta | EventMeta | optional | Display meta of range on event node when the timeline type is "bar"
eventData | array<Object> | optional | You can declare the events with object format as default events you want to place
effects | Effects | optional | You can declare effective styles as view of the timeline object
colorScheme | ColorScheme | optional | Can overwrite defaults UI color of the event nodes
storage | string | optional default: "session" | Specification of Web storage to cache event data, defaults to sessionStorage
reloadCacheKeep | boolean | optional default: true | Whether to load cached events during reloading, the cache is discarded if false
zoom | boolean | optional default: false | Whether to use the ability to zoom the scale of the timeline by double clicking on any scale on the ruler
wrapScale | boolean | optional default: true | Whether wrapping new scale in the timeline container when zoom
engine | string | optional default: "canvas" | Choose dependent module to core as rendering engine. It'll be "canvas" or "d3.js"; Maybe add in future version
debug | boolean | optional default: false | Enable to debug mode if true then output logs for debugging to console; defaults to false

### public Effects: Object since 2.0.0 source

Various effect settings to the timeline object displayed in the DOM

#### Properties:

Name | Type | Attribute | Description
presentTime | boolean | optional default: false | Whether to show marking a present time on the timeline container.
hoverEvent | boolean | optional default: true | Whether to show the effect when individual events on the timeline container are mouse over.
stripedGridRow | boolean | optional default: true |
horizontalGridStyle | string | optional default: "solid" | The style of horizontal grid line on the Timeline container. possible values are "solid", "dotted", "none".
verticalGridStyle | string | optional default: "solid" | The style of vertical grid line on the Timeline container. possible values are "solid", "dotted", "none".

### public EventColors: Object since 2.0.0 source

Color scheme to overwrite defaults UI color of the event node

#### Properties:

Name | Type | Attribute | Description
text | string | optional default: "#343A40" | Defaults to text color of the event node
border | string | optional default: "#6C757D" | Defaults to border color of the event node
background | string | optional default: "#E7E7E7" | Defaults to background color of the event node

### public EventMeta: Object since 2.0.0 source

#### Properties:

Name | Type | Attribute | Description
display | boolean | optional default: false |
scale | string | optional default: "day" |
locale | string | optional default: "en-US" | This value is an argument "locales" of `dateObj.toLocaleString([locales[, options]])`
format | LocaleOptions | optional | This value is an argument "options" of `dateObj.toLocaleString([locales[, options]])`
content | string | optional | This is value for if you want to show custom content on the meta

### public EventParams: Object since 2.0.0 source

The preset as default of event parameters on the timeline

#### Properties:

Name | Type | Attribute | Description
uid | string |  | An unique id of event data, this can not define because this value is automatically generate as data for cache only
eventId | number | optional nullable: true | It is an ID that identifies an event for you to manipulate event data via each method. If omitted, consecutive numbers are automatically assigned.
x | number |  | Can not define because this value is automatically generate as data for cache only
y | number |  | Can not define because this value is automatically generate as data for cache only
width | number |  | Can not define because this value is automatically generate as data for cache only
height | number |  | Can not define because this value is automatically generate as data for cache only
start | string |  | Can not define because this value is automatically generate as data for cache only
end | string |  | Can not define because this value is automatically generate as data for cache only
row | number |  | Can not define because this value is automatically generate as data for cache only
bgColor | string | optional default: "#E7E7E7" |
color | string | optional default: "#343A40" |
bdColor | string | optional default: "#6C757D" |
label | string | optional |
content | string | optional |
category | string | optional |
image | string | optional |
margin | number | optional |
rangeMeta | string | optional |
size | number | string | optional default: "normal" | Define the diameter size of pointer when type of the timeline is "point". Possible values are "large", "normal", "small" and value of pixel.
extend | Object | optional | The specified key/value pair is replaced with the data attribute of the event element.
remote | boolean | optional default: false |
relation | RelationOption | optional | Setting for connecting events by relation lines when the timeline type is "point".
callback | function | optional | Callback processing that binds to openEvent method when this event is clicked.

### public Footer: Object since 2.0.0 source

#### Properties:

Name | Type | Attribute | Description
display | boolean | optional default: true | Whether to display headline
content | string | optional |
range | boolean | optional default: false | Visible if true
locale | string | optional default: "en-US" | This value is an argument "locales" of `dateObj.toLocaleString([locales[, options]])`
format | LocaleOptions | optional | This value is an argument "options" of `dateObj.toLocaleString([locales[, options]])`

### public Headline: Object since 2.0.0 source

#### Properties:

Name | Type | Attribute | Description
display | boolean | optional default: true | Whether to display headline
title | string | optional |
range | boolean | optional default: true | Hide if false
locale | string | optional default: "en-US" | This value is an argument "locales" of `dateObj.toLocaleString([locales[, options]])`
format | LocaleOptions | optional | This value is an argument "options" of `dateObj.toLocaleString([locales[, options]])`

### public LimitScaleGrids: Object since 2.0.0 source

The limited grid number per scale of timeline

#### Properties:

Name | Type | Attribute | Description
millennium | number | optional default: 100 | In other words it's 100000 years
century | number | optional default: 500 | In other words it's 50000 years
decade | number | optional default: 500 | In other words it's 5000 years
lustrum | number | optional default: 500 | In other words it's 2500 years
year | number | optional default: 500 | In other words it's 500 years
month | number | optional default: 540 | In other words it's 45 years
week | number | optional default: 530 | In other words it's 10 years
day | number | optional default: 366 | In other words it's about 1 years
hour | number | optional default: 720 | In other words it's 30 days
quarterHour | number | optional default: 720 | In other words it's 7.5 days
halfHour | number | optional default: 720 | In other words it's 15 days
minute | number | optional default: 720 | In other words it's 12 hours
second | number | optional default: 900 | In other words it's 15 minutes

### public LocaleOptions: Object source

In principle, this option conforms to the specification of options in "Date.prototype.toLocaleString()". However, there includes some extensions of this plugin original.

#### Properties:

Name | Type | Attribute | Description
hour12 | boolean | optional default: false | Whether to use 12-hour time (as opposed to 24-hour time). Possible values are true and false.
localeMatcher | string | optional |
timeZone | string | optional |
hourCycle | string | optional |
formatMatcher | string | optional |
weekday | string | optional | The representation of the weekday. Possible values are "narrow", "short", "long".
era | string | optional | The representation of the era. Possible values are "narrow", "short", "long".
year | string | optional | The representation of the year. Possible values are "numeric", "2-digit". Then an extended value by this plugin is "zerofill".
month | string | optional | The representation of the month. Possible values are "numeric", "2-digit", "narrow", "short", "long".
day | string | optional | The representation of the day. Possible values are "numeric", "2-digit". Then an extended value by this plugin is "ordinal".
hour | string | optional | The representation of the hour. Possible values are "numeric", "2-digit". Then an extended value by this plugin is "fulltime".
minute | string | optional | The representation of the minute. Possible values are "numeric", "2-digit". Then an extended value by this plugin is "fulltime".
second | string | optional | The representation of the second. Possible values are "numeric", "2-digit". Then an extended value by this plugin is "fulltime".
timeZoneName | string | optional | The representation of the time zone name. Possible values are "short", "long".

#### See:

- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString

### public RelationOption: Object source

#### Properties:

Name | Type | Attribute | Description
before | number | optional | Set target eventID to connect the relation line to the event (leftward on the timeline) in chronological before from oneself event.
after | number | optional | Set target eventID to connect the relation line to the event (rightward on the timeline) in chronological after from oneself event.
linesize | number | optional |
linecolor | string | optional |
curve | number | string | boolean | optional | Whether the connection line is curved if the connection events are not on the same horizontal. If you specify a boolean value or a shorthand (0 or 1 only), it will be automatically curved. As with the previous version, it is also possible to specify the type of curve using defined preset values.

### public Ruler: Object since 2.0.0 source

You can set the upper and lower ruler individually

#### Properties:

Name | Type | Attribute | Description
top | RulerOptions | optional | The upper ruler configuration. The upper ruler is hidden if omitted.
bottom | RulerOptions | optional | The lower ruler configuration. The lower ruler is hidden if omitted.

### public RulerOptions: Object since 2.0.0 source

Can define the ruler position to top or bottom and both

#### Properties:

Name | Type | Attribute | Description
lines | array<String> | optional | Multiple tick marks can be set, and array elements are set in order from the top. Set same scale of Default.scale if omitted this. c.g. [ 'year', 'month', 'day', 'weekday' ]
height | number | optional default: 30 | The height of a row of rulers
fontSize | number | optional default: 14 |
color | string | optional default: "#777777" |
background | string | optional default: "#FFFFFF" |
locale | string | optional default: "en-US" | This value is an argument "locales" of `dateObj.toLocaleString([locales[, options]])`
format | LocaleOptions | optional | This value is an argument "options" of `dateObj.toLocaleString([locales[, options]])`

### public Sidebar: Object since 2.0.0 source

#### Properties:

Name | Type | Attribute | Description
sticky | boolean | optional default: false | Whether does sticky the sidebar by using "display: sticky" of CSS.
overlay | boolean | optional default: false |
list | array<String> | optional | Define the contents of the row of the sidebar. Appropriate escaping is necessary when using HTML.

### public ThemeColors: Object since 2.1.0 source

Color scheme to overwrite defaults UI color of the timeline instance

#### Properties:

Name | Type | Attribute | Description
name | string | optional default: "default" |
text | string | optional default: "#343A40" | Defaults to basic text color
subtext | string | optional default: "#707070" |
offtext | string | optional default: "#BBBBBB" |
modesttext | string | optional default: "#969696" |
line | string | optional default: "#6C757D" | Defaults to basic border color
offline | string | optional default: "#DDDDDD" |
activeline | string | optional default: "#DC3545" |
background | string | optional default: "#FFFFFF" | Defaults to background color
invertbg | string | optional default: "#121212" |
striped1 | string | optional default: "#F7F7F7" |
striped2 | string | optional default: "#F0F0F0" |
active | string | optional default: "#F73333" |
marker | string | optional default: "#2C7CFF" |
gridbase | string | optional default: "#333333" |