queryTaskbarInfo not working properly with virtualization.
Hi! I have this Gantt Chart, I have aprox. 200 tasks, so I need the virtualization for it to go kinda smooth.
The problem is that I have my function
const queryTaskbarInfo = (args) => {
const ganttObj = document.getElementById("Editing").ej2_instances[0];
const allTasks = ganttObj.flatData;
const color = getTaskbarColor(args.data);
args.taskbarBgColor = color;
if (canDelayProject(args.data, allTasks)) {
args.taskbarBorderColor = "#FF0000"; // Red border for tasks that may delay the project
args.taskbarBorderWidth = 2;
}
};
That gets the color from:
const getTaskbarColor = (task) => {
const today = new Date();
const startDate = new Date(task.FECHA_INICIO);
const endDate = new Date(task.FECHA_FIN);
console.log("TASK", task);
if (task.PROGRESO === 100) {
return "#4CAF50"; // Green for completed tasks
} else if (today > endDate && task.PROGRESO < 100) {
return "#F44336"; // Red for overdue tasks
} else if (today >= startDate && today <= endDate) {
return "#2196F3"; // Blue for in-progress tasks
} else {
return "#FFC107"; // Yellow for upcoming tasks
}
};
With virtualization enabled, the inital view has all the taskBar colors correctly, but once virtualization enters on scroll, it goes crazy and sometimes it shows the color, other times it doesn't, and it's weird
Intitial Load:
After scrolling it goes crazy:
These are my Gantt props:
<GanttComponent
id="Editing"
style={{ borderRadius: "50px !important" }}
dataSource={filteredTasks}
dateFormat={"MMM dd, y"}
treeColumnIndex={0}
durationUnit="Day"
allowSelection={true}
allowFiltering={true}
showColumnMenu={true}
highlightWeekends={true}
allowUnscheduledTasks={true}
projectStartDate={projectStartDate}
projectEndDate={projectEndDate}
taskFields={taskFields}
timelineSettings={timelineSettings}
labelSettings={labelSettings}
splitterSettings={splitterSettings}
height="100%"
editSettings={editSettings}
sortSettings={sortSettings}
allowResizing={true}
allowSorting={true}
gridLines={gridLines}
toolbar={simple ? [] : toolbar}
allowTaskbarDragAndDrop={false}
allowRowDragAndDrop={!simple}
actionComplete={actionComplete}
enableVirtualization={true}
enableTimelineVirtualization={true}
autoCalculateDateScheduling={true}
enableVirtualMaskRow={true}
readOnly={simple}
enableUndoRedo={true}
undoRedoActions={undoRedoActions}
collapseAllParentTasks={simple}
loadChildOnDemand={true}
immediateRender
taskMode="auto"
queryTaskbarInfo={queryTaskbarInfo}
>
SIGN IN To post a reply.
3 Replies
SIGN IN To post a reply.
