Basic Timeline in JavaScript

var options = {
  series: [
    {
      data: [
        {
          x: 'Draft',
          y: [
            new Date('2024-03-02').getTime(),
            new Date('2024-03-04').getTime(),
          ],
        },
        {
          x: 'Edit',
          y: [
            new Date('2024-03-04').getTime(),
            new Date('2024-03-08').getTime(),
          ],
        },
        {
          x: 'Review',
          y: [
            new Date('2024-03-08').getTime(),
            new Date('2024-03-12').getTime(),
          ],
        },
        {
          x: 'Publish',
          y: [
            new Date('2024-03-12').getTime(),
            new Date('2024-03-18').getTime(),
          ],
        },
      ],
    },
  ],
  chart: {
    height: 350,
    type: 'rangeBar',
  },
  title: {
    text: 'Content Production Pipeline',
  },
  plotOptions: {
    bar: {
      horizontal: true,
    },
  },
  xaxis: {
    type: 'datetime',
  },
}

var chart = new ApexCharts(document.querySelector('#chart'), options)
chart.render()