Our state of the art Gantt chart


Post by tikhonov.a.p »

Good afternoon. I'm using Gantt 4.3.8 to 5.0.0, there is no way to upgrade yet.

There was a need to save the display state: features, state, columns, etc.

I tried to do it like this, (I attached the code with a simplified example)

    /**
     * Change full gantt view state: columns, gantt.state
     */
    function setGanttFullState() {
        let gantt = ganttRef.current.instance
        let ganttViewState = {
            "state": {
                "barMargin": 2,
                "rowHeight": 41
            },
            "features": {
                "dependencies": {
                    "disabled": false
                },
                "criticalPaths": {
                    "disabled": false
                },
                "labels": {
                    "disabled": false
                }
            },
            "columns": [
                {
                    "id": "wbs",
                    "type": "wbs",
                    "width": 50,
                    "field": "wbsValue",
                    "hidden": false
                },
                {
                    "id": "name",
                    "type": "name",
                    "width": 250,
                    "field": "name",
                    "hidden": false
                },
                {
                    "id": "startdate",
                    "type": "startdate",
                    "width": 130,
                    "field": "startDate",
                    "hidden": false,
                    "format": "L"
                },
                {
                    "id": "enddate",
                    "type": "enddate",
                    "width": 130,
                    "field": "endDate",
                    "hidden": false,
                    "format": "L"
                },
                {
                    "id": "duration",
                    "type": "duration",
                    "width": 100,
                    "field": "fullDuration",
                    "hidden": false,
                    "format": ""
                },
                {
                    "id": "resourceassignment",
                    "type": "resourceassignment",
                    "width": 120,
                    "field": "assignments",
                    "hidden": false
                },
                {
                    "id": "percentdone",
                    "type": "percentdone",
                    "width": 70,
                    "field": "percentDone",
                    "hidden": false,
                    "format": ""
                },
                {
                    "id": "predecessor",
                    "type": "predecessor",
                    "width": 112,
                    "field": "predecessors",
                    "hidden": false
                },
                {
                    "id": "successor",
                    "type": "successor",
                    "width": 112,
                    "field": "successors",
                    "hidden": false
                },
                {
                    "id": "schedulingmodecolumn",
                    "type": "schedulingmodecolumn",
                    "width": 100,
                    "field": "schedulingMode",
                    "hidden": false
                },
                {
                    "id": "calendar",
                    "type": "calendar",
                    "width": 100,
                    "field": "calendar",
                    "hidden": false
                },
                {
                    "id": "constrainttype",
                    "type": "constrainttype",
                    "width": 146,
                    "field": "constraintType",
                    "hidden": false
                },
                {
                    "id": "constraintdate",
                    "type": "constraintdate",
                    "width": 146,
                    "field": "constraintDate",
                    "hidden": false,
                    "format": "L"
                },
                {
                    "id": "deadlinedate",
                    "type": "deadlinedate",
                    "width": 146,
                    "field": "deadlineDate",
                    "hidden": false,
                    "format": "L"
                },
                {
                    "id": "effort",
                    "type": "effort",
                    "width": 100,
                    "field": "fullEffort",
                    "hidden": false,
                    "format": ""
                },
                {
                    "id": "note",
                    "type": "note",
                    "width": 150,
                    "field": "note",
                    "hidden": false
                },
                {
                    "id": "showintimeline",
                    "type": "showintimeline",
                    "width": 100,
                    "field": "showInTimeline",
                    "hidden": false
                },
                {
                    "id": "sequence",
                    "type": "sequence",
                    "width": 70,
                    "field": "sequenceNumber",
                    "hidden": false
                },
                {
                    "id": "addnew",
                    "type": "addnew",
                    "width": 100,
                    "field": null,
                    "hidden": false
                }
            ]
        }
        if (gantt) {
            if (ganttViewState.state) {
                    gantt.state = {...gantt.state, ...ganttViewState.state}
            }

        if (ganttViewState.features) {
            Object.keys(ganttViewState.features).forEach(feature => {
                if (gantt.features[feature]) {
                    gantt.features[feature].disabled = ganttViewState.features?.[feature]?.disabled ?? false
                }
            })
        }

        if (ganttViewState.columns) {
            gantt.columns.beginBatch()
            let currentColumns = gantt.columns.records.filter((it) => {
                return it.data.type !== "timeAxis"
            })
            gantt.columns.remove(currentColumns)
            gantt.columns.endBatch()
            gantt.columns.add(ganttViewState.columns)
        }
    }
}

However, after some interval of calls to the window.setGanttState() function, timeAxis starts to grow step by step.

Tell me, do I do it the way I do it, is this normal or is there another way?

I attached several screenshots and an example code that you can run and try to reproduce.

This requires opening the console and calling window.setGanttState() several times.

Attachments
Archive.zip
(3.66 MiB) Downloaded 49 times
Screenshot 2022-03-23 at 09.08.08.png
Screenshot 2022-03-23 at 09.08.08.png (517.37 KiB) Viewed 625 times
Screenshot 2022-03-23 at 09.09.18.png
Screenshot 2022-03-23 at 09.09.18.png (635.92 KiB) Viewed 625 times

Post by alex.l »

Thank you for your report. Reproduced in 5.0.2 as well. No idea for workarounds for now, I've opened a ticket to fix this problem https://github.com/bryntum/support/issues/4401

All the best,
Alex


Post by tikhonov.a.p »

Will it be possible to fix it in version 4.3.X?
There is currently no way to upgrade to a newer major/minor version.


Post by alex.l »

No, unfortunately, we do not support old version.

All the best,
Alex


Post by tikhonov.a.p »

HI, when this bug will fix?


Post by alex.l »

No terms for now. According to the milestone, it should be there in one of 5.x minor patch releases.
You can see a milestone version to get some raw estimation when it's planned to be fixed. But we cannot provide any dates.

All the best,
Alex


Post by tikhonov.a.p »

Good day, but there is an opportunity from all my tickets to raise more priority for this, it greatly interferes with work (


Post by alex.l »

We are working as hard as we can at keeping the products in good shape, but we are a dev team of limited size and thus we have to prioritize which bugs we fix first. Will review your reported bugs with the team and see if we can bump prio on some of them.

All the best,
Alex


Post Reply