10 Javascript Timeline Libraries

Timeline, in the digital world, is a way of narrating a story in the chronological order. Reading a list of dates and events in a table is never as interesting as poring over a detailed timeline. So here are Javascript Libraries for creating beautifully crafted timelines easily.

Responsive Timeline

You can create your own timeline for your personal website or portfolio. This timeline based on CSS3 and jQuery. It consist of very simple interface for editing ,modern design and various transitions styles. Included are over 40+ animations, 10+ styles.

First - Responsive Timeline

Timeline.js

TimelineJS is an open-source tool that enables anyone to build visually,rich, interactive timelines. Beginners can create a timeline using nothing more than a Google spreadsheet. Experts can use their JSON skills to create custom installations, while keeping TimelineJS’s core look and functionality.

knightjs-2

Timesheet.js

Visualize your data and events with sexy HTML5 and CSS3. Create simple time sheets with sneaky JavaScript. Style them with CSS and have mobile fun as well …

timesheet-5

Chronoline.js

Chronoline.js is a library for making a chronology timeline out of events on a horizontal timescale. From a list of dates and events, it can generate a graphical representation of schedules, historical events, deadlines, and more. It requires raphael.js to function.

chronojs-1

Vis.js

The library is designed to be easy to use, to handle large amounts of dynamic data, and to enable manipulation of and interaction with the data. The library consists of the components DataSet, Timeline, Network, Graph2d and Graph3d.

visjs-3

Timeglider.js

TimeGlider is a data-driven interactive timeline application built using JavaScript. You can “grab” the timeline and drag it left and right, and zoom in and out to view centuries at a time or just hours.

timegliderjs-4

Timeknots

Minimalist timeline in javascript based on d3.js.

timeknot-7

TimelineSetter

TimelineSetter will create a unique HTML page that embeds a JSON object with your data. The CSS and JavaScript are identical for every timeline created, so you can host those centrally and simply point to them when you deploy a timeline.

timelinesetter-8

Simile widgets

The SIMILE project of MIT develops open source tools to process and visualize all kinds of digital data. One of their widgets you can integrate in your own website and/or pair with other applications.

simile-9

Timemap.js

Timemap.js is a Javascript library to help use online maps, including Google, OpenLayers, and Bing, with a SIMILE timeline. The library allows you to load one or more datasets in JSON, KML, or GeoRSS onto both a map and a timeline simultaneously.

timemaps-10


1 Comments

  1. Great stuff, thanks!

Leave a comment

Please be polite. We appreciate that. Your email address will not be published and required fields are marked