OverView
The timeline uses regular HTML DOM to render timelines and items placed on the timeline, allowing for flexible customization using this CSS style.
Install or download the vis.js library in your project's subfolders Include Library's script and CSS files in the head of your HTML code:
<html> <script src="vis/dist/vis.js"></script> <link href="vis/dist/vis.css" rel="stylesheet" type="text/css" /> </html>
The timeline is a
var timeline = new vis.Timeline(container, items, options);
Items
var items = new vis.DataSet([ { start: new Date(2010, 7, 15), end: new Date(2010, 8, 2), // end is optional content: 'Trajectory A' // Optional: fields 'id', 'type', 'group', 'className', 'style' } // more items... ]);
More From Oodles
Ready to innovate? Let's get in touch
Cookies are important to the proper functioning of a site. To improve your experience, we use cookies to remember log-in details and provide secure log-in, collect statistics to optimize site functionality, and deliver content tailored to your interests. Click Agree and Proceed to accept cookies and go directly to the site or click on View Cookie Settings to see detailed descriptions of the types of cookies and choose whether to accept certain cookies while on the site.
About Author
Puneet Sharma
Puneet is an experienced Lead UI Developer, having good knowledge of Angular Js, TypeScript, HTML5, CSS3, Javascript, Jquery, Photoshop.