Our state of the art Gantt chart


Post by tsvetelin.saykov »

Hi

I've been integrating Gantt component into Angular 8 application. Data is fetched via API using transport load/sync configuration of ProjectModel

Once data is loaded, I am experiencing 3 issues (see the screen shot)
1. The presented time period ends in December, but last task finish in January and green/blue bars is not fully visible
2. Calculated project end line is staying in the middle of the period - how this date is calculated?
3. Project start date is not visible at all

Please could you let me know
1. How to improve the automatic zoom, so after loading the data all tasks will be visible?
Do I need to invoke gantt.zoomToFit after data loading? How?

2. How to fix project start/end dates

Thank you very much for your help
Screenshot 2020-01-08 at 17.51.26.png
Screenshot 2020-01-08 at 17.51.26.png (224.54 KiB) Viewed 979 times

Post by mats »

How are you loading your data? Are you able to provide us a test case? The end is calculated as the latest end date of your project.

To show the full project, please use the Gantt API:
 
project.on({
    load : () => gantt.zoomToFit()
});
Docs: https://bryntum.com/docs/gantt/#Scheduler/view/mixin/TimelineZoomable#function-zoomToFit

Post by tsvetelin.saykov »

Please find below the link to the JSON returned by our API

https://codebeautify.org/jsonviewer/cb09c781

Here is the configuration of ProjectModule:
transport: {
	load : {
		url       : '..................',
		requestConfig: {
			method: 'GET',
			headers: {
				Authorization: '..................',
				'Content-Type': 'application/json',
			},
			fetchOptions: {
				credentials: 'omit',
				redirect: 'follow',
				mode: 'cors',
			}
		}
	},
	sync : {
		url : '..................'
		requestConfig: {
			headers: {
				Authorization: '..................',
				'Content-Type': 'application/json',
			},
			fetchOptions: {
				credentials: 'omit',
				redirect: 'follow',
				mode: 'cors',
			}
		}
	}
},

Post by tsvetelin.saykov »

A little bit more information about project start/end lines. Once I implement listener to task store as follow
project.taskStore.on({load : () => gantt.zoomToFit({leftMargin  : 25, rightMargin : 25}) });
Then project start/end lines become properly calculated (see attached images). If I comment the above code, the same results as the attached image from my initial post
Screenshot 2020-01-09 at 9.35.15.png
Screenshot 2020-01-09 at 9.35.15.png (219.28 KiB) Viewed 969 times

Post by sergey.maltsev »

Hi!

Thanks for the report.
We have this ticket to fix it
https://github.com/bryntum/support/issues/80

You could try to use this temporary workaround to refresh lines after zoomToFit call via reenabling projectLines feature (which is enabled already actually).
gantt.zoomToFit();
gantt.features.projectLines.disabled = false;

Post Reply