Creating a Basic Gantt Chart

Creating a basic gantt chart using ApexGantt.js

To create a basic gantt chart with minimal configuration, write as follows:

<div id="gantt-container"></div>

const ganttOptions = {
    series: [
      {
        id: 'a',
        startTime: '10-11-2024',
        endTime: '11-01-2024',
        name: 'task 1',
        progress: 65,
      },
      {
        id: '5',
        startTime: '10-11-2024',
        endTime: '10-26-2024',
        name: 'subtask 1.1',
        parentId: 'a',
        progress: 65,
      },
    ],
  };
  const gantt = new ApexGantt(document.getElementById('gantt-container'), ganttOptions);
  gantt.render();

Reset Password

Creating a Basic Gantt Chart

Stay Updated