angular-timeline

Angular directive to display an interactive visualization chart to visualize events in time.

Added by: Sam Deering

GitHub

Repository

destegabry/angular-timeline

Stats

Stars: 30

Watchers: 30

Forks: 11

Module Description

angular-timeline

A really simple angular directive to display a loader image while loading ajax resources, relying on Almende Timeline.

Added the range-popup item type to display contents on a tooltip when hovering, so you have to rely on Bootstrap tooltips.

Requirements

Include Almende Timeline (CSS, JS) and Bootstrap tooltip (CSS, JS) in your <head> section:

<link rel="stylesheet" href="PATH_TO_STYLES/bootstrap.css">
<link rel="stylesheet" href="PATH_TO_STYLES/timeline.css">

<script src="PATH_TO_LIB/timeline.js"></script>
<script src="PATH_TO_LIB/bootstrap-tooltip.js"></script>

Usage

Create a div with the timeline attribute to instantiate a Timeline. Data must be passed as an array of objects, read the Almende Timeline documentation on available fields.

<div timeline="data" 
     timeline-options="options"
     timeline-selection="selection"></div>

The timeline-options attribute provides access to Timeline configuration, read the Almende Timeline documentation on available options.

The timeline-selection attribute provides two-way binding on selected/selecting object.

Credits

Credits to Almende providing the excellent CHAP Links Library

Module stats last updated: 2017-04-11 15:00:02

Disclaimer: Some data on this page may have been gathered from the authors GitHub respository. If you see any mistakes or outdated information please let us know. Thanks!