How can i assign dynamic background color in task cell

Gantt
#1

I’ve tried with
gantt.templates.task_cell_class = function(item, date) {
if (holidays.includes(moment(date).format(‘DD-MM-YYYY’))) return ‘customClass’;
else if (!gantt.isWorkTime({ date: date, task: item })) return ‘weekend’;
};

But instead of class i want to use the dynamic style.

#2

Hello @Subhasis,

The current way of styling timeline cells - is through the timeline_cell_class(task_cell_class in old versions) template which returns the class name.

Unfortunately, there is no way to return color styles directly, so I only can suggest you define different classes to colorizing, like :

.weekend-red{
...
}
.weekend-green{
...
}

Also, you can try to implement some custom solution to change class colors directly from js if you don’t want to create many classes, unfortunately, I can’t give you any advice on implementation.

API Templates of the Timeline Area :
https://docs.dhtmlx.com/gantt/desktop__timeline_templates.html

#3

Hello @Subhasis,

I forgot to say in the previous answer: in case if you are unable to stylize timeline cells in advance, you can generate CSS dynamically, as described in the following article:
https://docs.dhtmlx.com/gantt/desktop__colouring_tasks.html#loadingcolorswithdata