ng-vertical-timeline

This is a Angular library that generates a vertical timeline.


Keywords
Angular, Library, Timeline, Component
License
MIT
Install
npm install ng-vertical-timeline@0.1.2

Documentation

$ npm i ng-vertical-timeline

Editor / Demo

1 - Add the NgVerticalTimelineModule module to your app.module.ts file:

import { NgVerticalTimelineModule  } from 'ng-vertical-timeline';
...
@NgModule({
  imports: [
    ...
    NgVerticalTimelineModule
  ],
...

2 - Create an array of events


   events = [
    {
      id: 0,
      title: 'My last travel',
      content: 'There are so much countries in the world...',
      date: '2016 - 2019',
      icon: 'https://image.flaticon.com/icons/svg/214/214335.svg'
    },
    {
      id: 1,
      title: 'My Job',
      content: 'The best job I could possibly get!',
      date: '2015 - 2016',
      icon: 'https://image.flaticon.com/icons/svg/1006/1006517.svg'
    },
    {
      id: 2,
      title: 'My Education',
      content: 'This is the university I went...',
      date: '2011',
      icon: 'https://image.flaticon.com/icons/svg/1141/1141771.svg'
    }
  ];

3 - Add the selector ng-vertical-timeline to your componenent:


<ng-vertical-timeline [data]="events"></ng-vertical-timeline>

This project is licensed under the MIT License