Skip to content

Commit

Permalink
Create timeline.md
Browse files Browse the repository at this point in the history
  • Loading branch information
williln committed May 23, 2024
1 parent 503ffd2 commit 444526e
Showing 1 changed file with 24 additions and 0 deletions.
24 changes: 24 additions & 0 deletions javascript/timeline.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
# TimelineJS for building interactive timelines from spreadsheet or JSON

- [Timeline](https://timeline.knightlab.com/)

## Use case

I have a side project that I fuss with sometimes and I can't decide what to do with, and one of the many ideas I have is creating a timeline of important events. In researching how I might do this, I found this library.

## What is TimelineJS?

> 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, like the one we used for the Timeline above. Experts can use their JSON skills to create custom installations, while keeping TimelineJS's core functionality.
From their [docs](https://timeline.knightlab.com/#overview):

### Tips & tricks

1. Keep it short. We recommend not having more than 20 slides for a reader to click through.
2. Pick stories that have a strong chronological narrative. It does not work well for stories that need to jump around in the timeline.
3. Write each event as a part of a larger narrative.
4. Include events that build up to major occurrences — not just the major events.

Their docs include a live timeline that builds from a linked spreadsheet, and includes a lot of really neat examples. I can think of a past client where this might have come in handy, if I'd known any JS at all at the time.

<img width="1619" alt="Screenshot 2024-05-22 at 9 32 33 PM" src="https://github.com/williln/til/assets/2286304/e9790f9a-5519-41b5-94f5-420f600120cd">

0 comments on commit 444526e

Please sign in to comment.