RadiantQ jQuery Gantt Package
How to handle the overlapping state?
Previous Topic  Next Topic 


"AreTasksOverlappingCallBack" is used to handle the state of overlapping whether the task is overlapped or not. User can set the overlapping state by just returning the true or false in this callback function.


Here is the code Example.


$('#gantt_container').FlexyGantt({

    GanttChartTemplateApplied: function (sender, args) {

        var $GanttChart = args.element;

        $GanttChart.GanttChart({

            AreTasksOverlappingCallBack: function (entity, taskItemControl, isOverlapped) {

                if (isOverlapped) {

                    // Checking whether the overlapping task's type and the other task's type on same row is same.

                    // Here we checked, 'Task 1' and 'Task 2' (Team1-Resource2)

                    if (entity.options.Data.IsOverlapType && taskItemControl.options.Data.IsOverlapType)

                        return true; // Enables overlapping for specic task's types.

                    else

                        return false; // Breaks the default overlapping behaviour.

                }

            },

        });

    },

});


In this below json data have "IsOverlapType": true for which task needs to be handled in "AreTasksOverlappingCallBack" function to prevent default overlapping feature.

   

[

   {

      "TName":"Team1",

      "PStartTime":"2014-04-02T00:00:00Z",

      "PEndTime":"2014-04-22T00:00:00Z",

      "Resources":[

         {

            "RName":"Resource 1",

            "PStartTime":"2014-04-04T00:00:00Z",

            "PEndTime":"2014-04-22T00:00:00Z",

            "Tasks":[

               {

                  "TaskName":"Task 1",

                  "StartTime":"2014-04-06T00:00:00Z",

                  "EndTime":"2014-04-14T00:00:00Z",

                  "Progress":20,

                  "IsOverlapType":true

               },

               {

                  "TaskName":"Task 2",

                  "StartTime":"2014-04-12T00:00:00Z",

                  "EndTime":"2014-04-18T00:00:00Z",

                  "Progress":90,

                  "IsOverlapType":true

               }

            ]

         },

         {

            "RName":"Resource 2",

            "PStartTime":"2014-04-06T00:00:00Z",

            "PEndTime":"2014-04-18T00:00:00Z",

            "Tasks":[

               {

                  "TaskName":"Task 1",

                  "StartTime":"2014-04-10T00:00:00Z",

                  "EndTime":"2014-04-16T00:00:00Z",

                  "Progress":20

               },

               {

                  "TaskName":"Task 2",

                  "StartTime":"2014-04-06T00:00:00Z",

                  "EndTime":"2014-04-12T00:00:00Z",

                  "Progress":70

               }

            ]

         },

         {

            "RName":"Resource 3",

            "PStartTime":"2014-04-06T00:00:00Z",

            "PEndTime":"2014-04-06T00:00:00Z",

            "Tasks":[

               {

                  "TaskName":"Task 1",

                  "StartTime":"2014-04-06T00:00:00Z",

                  "EndTime":"2014-04-12T00:00:00Z",

                  "Progress":20,

                  "IsOverlapType":true

               },

               {

                  "TaskName":"Task 2",

                  "StartTime":"2014-04-13T00:00:00Z",

                  "EndTime":"2014-04-18T00:00:00Z",

                  "Progress":70,

                  "IsOverlapType":true

               }

            ]

         }

      ]

   }

]




� RadiantQ 2022. All Rights Reserved.