Contact History Librarian
Introduction to Timeline JS
TimelineJS allows you to create a visually attractive timeline that may incorporate a variety of media. Created by the Knight Lab at Northwestern University, the tool is primarily intended for journalists but can be used in many disciplines and is particularly useful for digital humanities projects. (quoted from here)
Key Features
|
 |
In-Class Example (together)
Let's develop a timeline showcasing three epidemics in the 21st century.
|
Epidemic: Severe Acute Respiratory Syndrome (SARS) Dates: 2002 - 2003 Text: Severe acute respiratory syndrome (SARS) is a viral respiratory disease of zoonotic origin caused by severe acute respiratory syndrome coronavirus (SARS-CoV or SARS-CoV-1), the first identified strain of the SARS coronavirus species severe acute respiratory syndrome–related coronavirus (SARSr-CoV). The first known cases occurred in November 2002, and the syndrome caused the 2002–2004 SARS outbreak. In the 2010s, Chinese scientists traced the virus through the intermediary of Asian palm civets to cave-dwelling horseshoe bats in Xiyang Yi Ethnic Township, Yunnan Media: https://upload.wikimedia.org/wikipedia/commons/7/76/Novel_Coronavirus_SARS-CoV-2.jpg Media Credit: From Wikimedia Commons, the free media repository Media Caption: This colorized transmission electron microscope image shows SARS-CoV-2—also known as 2019-nCoV, the virus that causes COVID-19—isolated from a patient in the U.S. Virus particles are shown emerging from the surface of cells cultured in the lab. The protruding capsid structures (so-called Spike protein) of the virus give these viruses their name, corona being the Latin term for crown |
|
Epidemic: Swine Flu Dates: 2009 - 2010 |
|
Epidemic: Middle East Respiratory Syndrome (MERS) Dates: 2015 - ongoing |
|
Epidemic: COVID-19 Dates: 2019 - ongoing |
Common Pitfalls
- Ensure the image URL is pointing to an actual image.
- A good way to check if an image can be used, open a new browser tab and paste the image URL to verify it is indeed an actual image before pasting into the Google Sheet. It should end with the image extension (.jpg, .jpeg, .gif, .png)
- Do not modify the template headers.
- If timeline headers are modified, the template will be unusable. Even if the headers are restored, the template may not work and may generate an error in the timeline. The solution is to launch a new template from the TimelineJS site and copy/paste all of the records, without the header, into a fresh template.
- Careful using Eras.
- An Era is specifically a method to color-code a span of years on the timeline itself. It does nothing else.
- An Era should not used to add timeline elements. It should not to be used either as a single event in time nor as an event that covers multiple years.
