Directory

← Back

granite-timeline

A timeline rendering element using d3 and d3-timelines plugin

Author

Rating

Popularity

<100

Published on webcomponents.org

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

  1. Import Web Components' polyfill (if needed):

    <script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
    
  2. Import Custom Element:

    <link rel="import" href="bower_components/granite-timeline/granite-timeline.html">
    
  3. Start using it!

    <granite-timeline data="{{data}}" axis="{{axis}}"></granite-timeline>
    

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -m 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

License

MIT License

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Dependencies

  • @granite-elements/granite-js-dependencies-grabber#^2.0.0
  • @polymer/polymer#^3.0.0
  • d3-timelines#github:lostinbrittany/d3-timeline#8786143466f4fd8a2ebe662a4c51967ff5a18141
Released
2018-06-04
Maturity
IMPORTED
License
MIT License

Compatibility

Framework
Polymer 3.0+
Polymer 2.0+ in 1.0.11
Browser
Browser Independent

granite-timeline - Vaadin Add-on Directory

A timeline rendering element using d3 and d3-timelines plugin granite-timeline - Vaadin Add-on Directory
[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/LostInBrittany/granite-timeline) # 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](https://lostinbrittany.github.io/granite-timeline) ## Usage ```html ``` ## Install Install the component using [Bower](http://bower.io/): ```sh $ bower install LostInBrittany/granite-timeline --save ``` Or [download as ZIP](https://github.com/LostInBrittany/granite-timeline/archive/gh-pages.zip). ## Usage 1. Import Web Components' polyfill (if needed): ```html ``` 2. Import Custom Element: ```html ``` 3. Start using it! ```html ``` ## Contributing 1. Fork it! 2. Create your feature branch: `git checkout -b my-new-feature` 3. Commit your changes: `git commit -m 'Add some feature'` 4. Push to the branch: `git push origin my-new-feature` 5. Submit a pull request :D ## License [MIT License](http://opensource.org/licenses/MIT)
Online