JavaScript Vue

Add a Timeline Chart to a Vue App

Spread the love

We can add a timeline chart to a Vue app with the vue-cute-timeline package.

vue-cute-timeline is a timeline component that we can use with Vue apps.

It displays a vertical timeline on our screen.

To install it, we run:

npm i vue-cute-timeline

Then we can use it by writing:

  <div id="app">
      <timeline-item bg-color="#9dd8e0">foo</timeline-item>
      <timeline-item :hollow="true">bar</timeline-item>
import { Timeline, TimelineItem, TimelineTitle } from "vue-cute-timeline";
export default {
  components: {

We just import the timeline components.

Then we get a vertical timeline with the content between the tags.

bg-color has a background color.

hollow makes the dot hollow.

vue-cute-timeline lets us add a timeline to our app easily.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *