Class: Timeline

WIND. Timeline

Creates an object of the Timeline class to be displayed on the web page.

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});

Classes

Part

Methods

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();