new Timeline(iddiv, options)
Creates an object of the Timeline class.
Parameters:
Name |
Type |
Description |
iddiv |
string
|
The ID of the Timeline object. |
options |
JSON
|
string in JSON format to set options for the Timeline objet. |
Timeline options:
Name |
Type |
Description |
top |
integer
|
Adjust the distance in px between the top border of the timeline and the top border of its containing element.( 10px by default ). |
left |
integer
|
Adjust the distance in px between the left border of the timeline and the left border of its containing element.( 10px by default ). |
height |
integer
|
Define the height in px of the timeline( 400px by default ). |
width |
integer
|
Define the width in px of the timeline( 600px by default ). |
color |
string
|
Define the color of the header if it exists( #3366CC by default ). |
border |
string
|
Define the color, the thickness and the type of the border. By default "#3366CC 2px solid".
See more here CSS Border. |
name |
string
|
Define the timeline's name( "Timeline Displayer" by default ). |
icon |
string
|
Define the timeline's icon in the form of an URL. |
draggable |
boolean
|
If false, prevents the timeline from being dragged. Dragging is disabled by default. |
resizable |
boolean
|
If false, prevents the timeline from being resized. Resizing is disabled by default. |
header |
boolean
|
Says whether the header is enabled or not. The header is disabled by default. |
removable |
boolean
|
If false, prevents the timeline from being removed. Removing is disabled by default. |
configurable |
boolean
|
If true, enables to configure the timeline from a menu. Configurable is disabled by default. |
Example
var timeline = new WIND.Timeline("timeline", {'top': 100, 'left': 100, 'width': 600, 'height': 400, 'name': "timeline",'draggable': false, 'resizable' : false,'color': '#FF9900', 'border': '#FF9900 2px solid', 'header': false, 'removable': false, 'configurable': false});
-
addAnnotation(annotation)
-
Adds an annotation objet to the timeline.
Parameters:
Name |
Type |
Description |
annotation |
Annotation
|
Annotation objet to add. |
Example
var timeline = new WIND.Timeline("timeline", {'top': 100, 'left': 100, 'width': 600, 'height': 400, 'name': "timeline",'draggable': false, 'resizable' : false,'color': '#FF9900', 'border': '#FF9900 2px solid', 'header': false, 'removable': false, 'configurable': false});
timeline.addAnnotation(annotation);
-
createAnnotation(sem, entity, tempoStart, tempoEnd) → {Annotation}
-
Creates an Annotaion objet on the timeline.
Parameters:
Name |
Type |
Description |
sem |
string
|
Represents the type of the Annotation objet to add. Its value can be anything. |
entity |
string
|
Name of the annotated entity. |
tempoStart |
string
|
The starting date of the annotation expressed according to ISO 8601 standard. |
tempoEnd |
string
|
The ending date of the annotation expressed according to ISO 8601 standard. |
Returns:
returns Annotation object.
-
Type
-
Annotation
Example
var timeline = new WIND.Timeline("timeline", {'top': 100, 'left': 100, 'width': 600, 'height': 400, 'name': "timeline",'draggable': false, 'resizable' : false,'color': '#FF9900', 'border': '#FF9900 2px solid', 'header': false, 'removable': false, 'configurable': false});
timeline.createAnnotation("Event","World Cup","2014-06-12","2014-07-13");
-
destroy()
-
Destroys the timeline and remove it from the page.
Example
var timeline = new WIND.Timeline("timeline", {'top': 100, 'left': 100, 'width': 600, 'height': 400, 'name': "timeline",'draggable': false, 'resizable' : false,'color': '#FF9900', 'border': '#FF9900 2px solid', 'header': false, 'removable': false, 'configurable': false});
timeline.destroy();