init

initializes a dhtmlxGantt inside a container

container	string | HTMLElement	an HTML container (or its id) where a dhtmlxGantt object will be initialized
from	Date	the start value of the time scale (X–Axis)
to	Date	the end value of the time scale (X–Axis)

Example

gantt.config.scale_unit = "month";
gantt.config.date_scale = "%F, %Y";
 
gantt.init("gantt_here");
gantt.load("tasks.json");

Using the 2nd and 3rd parameters of the method is a good way to set the boundary values of the time scale:

gantt.init("gantt_here", new Date(2023, 08, 10), new Date(2023, 08, 20));

Note, that date paremeters of the gantt.init method are shortcuts for start_date and end_date configs. The two code snippets below are equivalent to each other:

gantt.init("gantt_here", new Date(2023, 08, 10), new Date(2023, 08, 20));

and

gantt.config.start_date = new Date(2023, 08, 10);
gantt.config.end_date = new Date(2023, 08, 20);
gantt.init("gantt_here");

What these configs do is define and limit the displayed date range. Tasks that fall outside that specified range won't be displayed.

Using the date parameters of the gantt.init method, as well as start_date and end_date configs will cancel the fit_tasks setting.

If you want the time scale to be dynamically adjusted according to the date range, you can either skip these parameters or manage the time range dynamically.

Back to top