autoHeight equivalent for Gantt?

Gantt
#1

Hi, I cannot find anything so I am assuming there is none, but I wanted to ask nonetheless.

Does the autoHeight for Grid rows (DHTMLX - Grid. Rows auto height) exists for DHTMLX Gantt?

I found documentation for manual resize and static sizing Resizing Rows in Grid Gantt Docs

Is there a way to implement auto height?

Thank you

#2

Hello,
Unfortunately, there isn’t a built-in solution. However, you can achieve this manually. It might look something like this:

gantt.attachEvent('onDataRender', () => {
    let repaint = false;
    const textCells = document.querySelectorAll(`[data-column-name='text']`);

    textCells.forEach((el) => {
        const taskId = el.parentNode.dataset.taskId;

        if (taskId) {
            const taskHeight = gantt.getTaskHeight(taskId);

            if (taskHeight < el.scrollHeight) {
                const task = gantt.getTask(taskId);
                task.row_height = el.scrollHeight;
                repaint = true;
            }
        }
    })

    if (repaint) {
        setTimeout(() => {
            gantt.render();
        }, 0)
    }
});

Styles:

.gantt_tree_content{
    overflow: unset;   
}

.gantt_tree_content,
.gantt_task_content {
    line-height: 12px;
    white-space: normal;
    overflow-wrap: break-word;
}

Here is an example: DHTMLX Snippet Tool