SlideShare una empresa de Scribd logo
1 de 46
Descargar para leer sin conexión
TimelineSetter
     Al Shaw
    ProPublica
Spreadsheets to
interactive timelines
Impetus
Bespoke timeline applications
Bespoke timeline applications




       Differing series presentation
TimelineSetter
Ruby
  HTML
   CSS
JavaScript
Free.
  Open source.
Works everywhere.
Free.
  Open source.
Works everywhere.
Free.
  Open source.
Works everywhere.
Free.
  Open source.
Works everywhere.
TimelineSetter
Features
Automatically scales
 to t time ranges.
Color coded
series toggles.
Embed
arbitrary
 HTML.
Zooming.
     Scrolling.
Keyboard navigation.
Easily style to
match your site.
Fully iOS compatible.
Fully iOS compatible.

       FLASH
Drop code directly
 into your CMS.
How does it work?
Normal spreadsheet




Local Ruby         Web server or
 package              CMS
Built on Ruby
& RubyGems
http://rubygems.org
gem install timeline_setter
Set up your
spreadsheet
date   display_date   description   link   series   html
Anything Ruby can parse:
Try “March 20, 2010,” “3/20/2010,”
“Mar. 20, 2010 11:59 PM”



  date         display_date          description   link   series   html
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
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
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
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
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
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
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
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
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
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
Run the command
$ timeline-setter -c tbi.csv -m
== Files copied to /Users/ashaw/htdocs/
timeline.html
Upload to server or copy code into
WordPress, MT, EE or any other CMS
Demo: live Twitter data
http://propublica.github.com/timeline-setter/doc/
                twitter-demo.html
Roadmap
Smoother animations.
Override automatic intervals.
      Ranges of events.
Smoother animations.
Override automatic intervals.
      Ranges of events.
       Your idea here

                opensource@propublica.org
http://propublica.github.com/timeline-setter


   http://propublica.org/nerds

                  @A_L

Más contenido relacionado

Último

20200723_insight_release_plan
20200723_insight_release_plan20200723_insight_release_plan
20200723_insight_release_planJamie (Taka) Wang
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxGDSC PJATK
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1DianaGray10
 
Cloud Revolution: Exploring the New Wave of Serverless Spatial Data
Cloud Revolution: Exploring the New Wave of Serverless Spatial DataCloud Revolution: Exploring the New Wave of Serverless Spatial Data
Cloud Revolution: Exploring the New Wave of Serverless Spatial DataSafe Software
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Will Schroeder
 
Do we need a new standard for visualizing the invisible?
Do we need a new standard for visualizing the invisible?Do we need a new standard for visualizing the invisible?
Do we need a new standard for visualizing the invisible?SANGHEE SHIN
 
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024D Cloud Solutions
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024SkyPlanner
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8DianaGray10
 
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding TeamAdam Moalla
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...DianaGray10
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Commit University
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UbiTrack UK
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...Aggregage
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.YounusS2
 
Designing A Time bound resource download URL
Designing A Time bound resource download URLDesigning A Time bound resource download URL
Designing A Time bound resource download URLRuncy Oommen
 
Videogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfVideogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfinfogdgmi
 
Things you didn't know you can use in your Salesforce
Things you didn't know you can use in your SalesforceThings you didn't know you can use in your Salesforce
Things you didn't know you can use in your SalesforceMartin Humpolec
 
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesAI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesMd Hossain Ali
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfDianaGray10
 

Último (20)

20200723_insight_release_plan
20200723_insight_release_plan20200723_insight_release_plan
20200723_insight_release_plan
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptx
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
 
Cloud Revolution: Exploring the New Wave of Serverless Spatial Data
Cloud Revolution: Exploring the New Wave of Serverless Spatial DataCloud Revolution: Exploring the New Wave of Serverless Spatial Data
Cloud Revolution: Exploring the New Wave of Serverless Spatial Data
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
 
Do we need a new standard for visualizing the invisible?
Do we need a new standard for visualizing the invisible?Do we need a new standard for visualizing the invisible?
Do we need a new standard for visualizing the invisible?
 
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8
 
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.
 
Designing A Time bound resource download URL
Designing A Time bound resource download URLDesigning A Time bound resource download URL
Designing A Time bound resource download URL
 
Videogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfVideogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdf
 
Things you didn't know you can use in your Salesforce
Things you didn't know you can use in your SalesforceThings you didn't know you can use in your Salesforce
Things you didn't know you can use in your Salesforce
 
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesAI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
 

TimelineSetter

  • 1. TimelineSetter Al Shaw ProPublica
  • 5. Bespoke timeline applications Differing series presentation
  • 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.
  • 14. Automatically scales to t time ranges.
  • 17. Zooming. Scrolling. Keyboard navigation.
  • 18. Easily style to match your site.
  • 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
  • 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/
  • 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
  • 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

Notas del editor

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. \n
  20. \n
  21. \n
  22. \n
  23. \n
  24. \n
  25. \n
  26. \n
  27. \n
  28. \n
  29. \n
  30. \n
  31. \n
  32. \n
  33. \n
  34. \n
  35. \n
  36. \n
  37. \n
  38. \n
  39. \n
  40. \n
  41. \n
  42. \n
  43. \n
  44. \n
  45. \n
  46. \n