TimelineSetter is a free and open-source tool that allows users to create interactive timelines from spreadsheets. It converts spreadsheet data into timelines that can automatically scale to time ranges, include color-coded series toggles, and embed HTML. TimelineSetter outputs code that can be added to websites or content management systems. It is built with Ruby and works on all platforms.

1. TimelineSetter
Al Shaw
ProPublica

2. Spreadsheets to
interactive timelines

3. Impetus

4. Bespoke timeline applications

5. Bespoke timeline applications
Differing series presentation

6. TimelineSetter

7. Ruby
HTML
CSS
JavaScript

8. Free.
Open source.
Works everywhere.

9. Free.
Open source.
Works everywhere.

10. Free.
Open source.
Works everywhere.

11. Free.
Open source.
Works everywhere.

13. Features

14. Automatically scales
to t time ranges.

15. Color coded
series toggles.

16. Embed
arbitrary
HTML.

17. Zooming.
Scrolling.
Keyboard navigation.

18. Easily style to
match your site.

19. Fully iOS compatible.

20. Fully iOS compatible.
FLASH

21. Drop code directly
into your CMS.

22. How does it work?

23. Normal spreadsheet
Local Ruby Web server or
package CMS

24. Built on Ruby
& RubyGems
http://rubygems.org

25. gem install timeline_setter

26. Set up your
spreadsheet

27. date display_date description link series html

28. Anything Ruby can parse:
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

29. A human
date:
Jun. 9, 2010
Anything Ruby can parse:
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

30. A human
date: A text
Jun. 9, 2010 description of
the event
Anything Ruby can parse:
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

31. A human
date: A text
Jun. 9, 2010 description of
the event A URL for more
information
about the event
Anything Ruby can parse:
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

32. A human
date: A text
Jun. 9, 2010 description of
the event A URL for more
information Which series
about the event does the event
Anything Ruby can parse: belong to?
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

33. A human Any extra HTML
date: A text to show on the
Jun. 9, 2010 description of event card
the event A URL for more
information Which series
about the event does the event
Anything Ruby can parse: belong to?
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

34. A human Any extra HTML
date: A text to show on the
Jun. 9, 2010 description of event card
the event A URL for more
information Which series
about the event does the event
Anything Ruby can parse: belong to?
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

35. A human Any extra HTML
date: A text to show on the
Jun. 9, 2010 description of event card
the event A URL for more
information Which series
about the event does the event
Anything Ruby can parse: belong to?
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

36. A human Any extra HTML
date: A text to show on the
Jun. 9, 2010 description of event card
the event A URL for more
information Which series
about the event does the event
Anything Ruby can parse: belong to?
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

37. A human Any extra HTML
date: A text to show on the
Jun. 9, 2010 description of event card
the event A URL for more
information Which series
about the event does the event
Anything Ruby can parse: belong to?
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

38. A human Any extra HTML
date: A text to show on the
Jun. 9, 2010 description of event card
the event A URL for more
information Which series
about the event does the event
Anything Ruby can parse: belong to?
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”
date display_date description link series html

39. Run the command
$ timeline-setter -c tbi.csv -m
== Files copied to /Users/ashaw/htdocs/

40. timeline.html

41. Upload to server or copy code into
WordPress, MT, EE or any other CMS

42. Demo: live Twitter data
http://propublica.github.com/timeline-setter/doc/
twitter-demo.html

43. Roadmap

44. Smoother animations.
Override automatic intervals.
Ranges of events.

45. Smoother animations.
Override automatic intervals.
Ranges of events.
Your idea here
opensource@propublica.org

46. http://propublica.github.com/timeline-setter
http://propublica.org/nerds
@A_L