If the layout containing the Gantt chart is attached to a tab (“PROJECT”), when the width of the layout cell “Gantt of portfolio” is increase (ou decrease) the Gantt chart don’t adjust to the new size of the layout cell.
On the other hand, if the layout is not attached to a tab, the Gantt chart adjust fine to the the layout cell resized.
Hello,
Gantt doesn’t have integration with Suite, so it doesn’t know that its container was resized and doesn’t repaint itself.
I added it as a bug to our internal tracker. The dev team will fix it in the future, but I cannot give you any ETA.
Now, as a workaround, you can add the following code to watch the container sizes:
var previousHeight = gantt.$root.offsetHeight;
var previousWidth = gantt.$root.offsetWidth;
function lowlevelResizeWatcher() {
if (gantt.$root.offsetHeight != previousHeight ||
gantt.$root.offsetWidth != previousWidth) {
gantt.render();
}
previousHeight = gantt.$root.offsetHeight;
previousWidth = gantt.$root.offsetWidth;
setTimeout(lowlevelResizeWatcher, 20);
}
lowlevelResizeWatcher()
Please, try to reinit your your gantt after the selecting the “project” tabbar cell with the following code:
tabbar0.events.on("Change", function (activeId, prevId) {
if (activeId == "project") {
dhx.awaitRedraw().then(function () {
var el = document.querySelectorAll(".dhx_layout-cell")[1]
gantt.init(el)
})
}
return true
});
Here is the example: https://snippet.dhtmlx.com/fws5gb9i
as due to the shadow DOM usage the tabbar cell content is clearing from the page after deselecting the tab to clear the memory.
Also, if you are attaching a component (layout in your case) to the dhtmlx container (tabbar in your case), you don’t need to define the parent container in the config for that component.
var layout = new dhx.Layout("layout", { // there is no "layout" container and it won't be used for the init of your layout
//so replace it with:
//var layout = new dhx.Layout(null, {
width: "100%",
height: "600px",
//...
})
tabbar0.getCell("project").attach(layout); // comment this line to eliminate the bug of gantt chart resizing