Gantt segment shrinks after drag&drop


I have an issue with the gantt segment: after dropping the segment into the new position the segment shrinks, its end becoming equal to the start.

I am importing the DHTMLX Gantt into a JHipster application.

In the controller i’m configuring the gantt:

configGantt() {
	gantt.config.scale_unit = "day";
	gantt.config.subscales = [ 
		{ unit:"minute", step:30, date:"%H:%i"}
	gantt.config.scale_height = 54;
	gantt.config.xml_date = "%Y-%m-%d %H:%i";
	gantt.config.columns = [
		{name:"text", label:"Task name", tree:true, width:'*' }
	gantt.config.sort = true;

This is the function from the controller that parses the data from the server into the gantt format:

generateGanttDataFromServerGanttModels() {
	let data = [];
	for (let i = 0; i < this.ganttModels.length; i++) {
		let model: IGanttModel = this.ganttModels[i];
		var start = null;
		if (model.startDate != null) {
			var startLong = (new Date(model.startDate.toString())).getTime();
			start = new Date(startLong);
		var end = null;
		if (model.endDate != null) {
			var endLong = (new Date(model.endDate.toString())).getTime();
			end = new Date(endLong);
		var modelAsData = {
			text: model.text,
			start_date: start,
			end_date: end,
			parent: model.parentId

Do you have any advice on how to fix this problem?


It might happen if you have a task that starts and ends the same day, and its duration unit is “day”.
You can change the duration unit from days to hours:
Here is an example:

Hi ramil

Indeed that was the case. I’ve set the duration unit to hours like you suggested and it solved the issue.

Thank you for the concise and accurate response.