npm 中文文档 npm 中文文档
指南
npmjs.com (opens new window)
指南
npmjs.com (opens new window)
  • 快速入门

    • npm 是什么?
    • npm 安装和更新
    • npm 防止权限错误
    • npm package.json 文件
    • npm 安装包
    • npm 更新包
    • npm 卸载包
    • npm 创建 Node.js 模块
    • npm 发布和更新包
    • npm 使用语义化版本
    • npm 使用 Dist-tags 标记包
    • npm 包和模块的了解
  • 命令行
  • 配置 npm

TimelineJS3


TimelineJS v3: A Storytelling Timeline built in JavaScript.  https://timeline.knightlab.com

Overview


TimelineJS is a tool designed to help people with minimal technical skill tell rich, dynamic stories on the web. Most people will create timelines using the official authoring tool and embed their creations using a snip of HTML code offered at the end of that process.

For users of these content management systems (CMSes), there are plugins to facilitate the embedding process:

Wordpress
MediaWiki
Drupal

Getting Started


General users of TimelineJS should consult timeline.knightlab.com for instructions and documentation. Information on GitHub is primarily directed at those who are interested in working with the TimelineJS source code.

The authoritative documentation list is also on the main website, but here are some direct links which may be useful:

Available media types, relevant to users of any technical level
Instantiate a Timeline in your page instead of using an embed
Configuration options (for more technical users)
JSON configuration file format for those who prefer not to use Google Sheets

Contributing to TimelineJS


Are you trying to contribute to or develop TimelineJS3? Here's where you should start.

API


For users who instantiate a timeline in a page (as opposed to using the iframe embed model), this page roughly documents TimelineJS's JavaScript API, but note that because TimelineJS's primary use case is the embedded iframe, some of these methods have not been thoroughly tested.

Use via ES6 modules/webpack


To use in a project that uses ES6 modules and webpack, import the Timeline class and the CSS as follows

  1. ``` js
  2. import { Timeline } from '@knight-lab/timelinejs';
  3. import '@knight-lab/timelinejs/dist/css/timeline.css';
  4. ```
Last Updated: 2023-05-15 10:22:02