Dynamic fill of the entire line

Hello. I have a question. I have tasks that have the type project, this is how they look on the screen (example of one task). I want for this task all the background of the elements on the left and right to be painted in the color that is in the object of this task

Example of this task:
{
id: ‘10’,
object: ‘ПА-А’,
render: ‘split’,
start_date: ‘01-04-2025’,
duration: 3,
order: 10,
parent: ‘0’,
height: 100,
type: ‘project’,
bgColor: ‘red’,
},

there is a property bgColor

so I need the left and right for this project to have a color that is taken from this task (the colors can be different, it will not be possible to pre-register ready-made classes)

Hello Molven,
If you want to set the color of the task bar, you can add the color property to the task object:
https://docs.dhtmlx.com/gantt/desktop__colouring_tasks.html#specifyingstyleinthepropertiesofataskobject

Otherwise, you need to generate the style elements based on the task data and use the templates.
Here is an example of how it can be implemented:
https://snippet.dhtmlx.com/zietxgrd

But if you want to use a task property to set the color for the whole row without generating the styles, you need to implement a custom solution.
One of the ways to do that is to use the addTaskLayer method and create HTML elements for the whole row:
https://docs.dhtmlx.com/gantt/api__gantt_addtasklayer.html

Here is an example of how it can be implemented:
https://snippet.dhtmlx.com/diybcmxb

1 Like