dhtmlx_gantt_typescript_initialization_with_tasks_and_links.ts

1import { gantt } from "dhtmlx-gantt";
2
3// Configuration for Gantt
4gantt.config.date_format = "%Y-%m-%d %H:%i";
5
6// Initialize Gantt in a specific container
7const container: HTMLElement | null = document.getElementById("gantt_here");
8
9if (container) {
10    gantt.init(container);
11
12    // Load data into Gantt
13    gantt.parse({
14        data: [
15            { id: 1, text: "Project #1", start_date: "2025-04-01 00:00", duration: 5, progress: 0.6 },
16            { id: 2, text: "Task #1", start_date: "2025-04-06 00:00", duration: 3, progress: 0.4, parent: 1 },
17            { id: 3, text: "Task #2", start_date: "2025-04-09 00:00", duration: 3, progress: 0.2, parent: 1 }
18        ],
19        links: [
20            { id: 1, source: 1, target: 2, type: "1" },
21            { id: 2, source: 2, target: 3, type: "0" }
22        ]
23    });
24}