A timeline rendering element using d3 and d3-timelines plugin
granite-timeline
A timeline rendering element using d3 and d3-timeline plugin
Based on Polymer 2.x.
Doc & demo
https://lostinbrittany.github.io/granite-timeline
Usage
<granite-timeline
data='[{"times":[{"starting_time":1355752800000,"ending_time":1355759900000}, {"starting_time":1355767900000,"ending_time":1355774400000}]},{"times":[{"starting_time":1355759910000,"ending_time":1355761900000}]},{"times":[{"starting_time":1355761910000,"ending_time":1355763910000}]}]'
debug></granite-timeline>
Install
Install the component using Bower:
$ bower install LostInBrittany/granite-timeline --save
Or download as ZIP.
Usage
-
Import Web Components' polyfill (if needed):
<script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
-
Import Custom Element:
<link rel="import" href="bower_components/granite-timeline/granite-timeline.html">
-
Start using it!
<granite-timeline data="{{data}}" axis="{{axis}}"></granite-timeline>
Contributing
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -m 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request :D
License
Install
Framework Support
Browser Independent
Install with
Run the above npm command in your project folder.
If you have any issues installing, please
contact the author.
Release notes - Version 2.0.0
Dependencies
- @granite-elements/granite-js-dependencies-grabber#^2.0.0
- @polymer/polymer#^3.0.0
- d3-timelines#github:lostinbrittany/d3-timeline#8786143466f4fd8a2ebe662a4c51967ff5a18141