Our application uses dthmlx for displaying a read only version of a Gantt Chart.
Our application uses two divs of different dimensions, and we want to move the Gantt chart from one div to another. When we moved the Gantt chart from the smaller div to bigger, the Gantt container loses its scroll bars, and the width and height doesnt stay withing the parent container anymore.
Also when we moved it back to the smaller div, the Gantt Chart’s functionality is not working anymore. Also, the browser does not show any JS issues/errors. We tried in different browsers, and faced the same issue.
These are the two sample lines of code that we use for resizing the Gantt chart:
document.getElementById(“gantt_here”).style.height = “500px”;
document.getElementById(“gantt_here”).style.width = “1000px”;
setTimeout( function(){gantt.setSizes();gantt.render();}, 100 );
Is this the right approach?
Is there any other way to resize the chart dynamically? We tried refreshData() as well, and it did not seem to work either.
Hello,
calling gantt.render(); should be enough for updating gantt sizes after resizing the container.
I couldn’t reproduce the issue with initialization in another div, it seems working ok in a small demo
docs.dhtmlx.com/gantt/samples/01 … ztion.html
Can you please provide a sample that we could check?
Thank you Aliaksandr, it worked perfectly!