Ability to customize static_background logic


Ability to customize static_background logic


Hello Kevin,
Please clarify what you want to customize in the static background, what you want to change and how you imagine it should work.
If you want to add a custom picture, here is an example:


I’d like to have the ability to draw the background or draw the part of backgrpund by my self, or even just pass through a canvas object to it



Can you please elaborate a usage scenario a bit more?
E.g. tell me what is missing from the current background logic, how and why you’d want to change, how you want it to work, etc.
Do you have any suggestions on how can the API method would look like in order to allow you to do what you want?

Understanding the use case will help us to figure a solution. If it looks like a rare use case, we can suggest you some workarounds in order to do what you want using the current api. If it looks like something other users could make use of - we can add it to the component API.



first of all, I know that static background could improve a lot a performance, but it’s bad for the UI interaction, for example

  1. I could not draw a static background like this in order to fit our design:

  2. user interaction is not good, i can not user a easier way to height the row selected by user, I have to implement it in a much complicated way.


you can highlight rows and columns using existing public API using a bit of custom coding.
Rows in the timeline area can be highlighted using gantt.addTaskLayer method, and columns using markers extension:
Here is a complete example:

It adds some overhead to the data render, but depending on the project you have it can be bearable.
If you want to be able to color individual cells of the timeline - this approach won’t work and currently, we don’t have a good solution.

As for the static background approach, it may be a bit challenging, you’ll have to modify the source codes.
I don’t think it can be solved with us adding a public hook to the static rendering API from our end.


Thanks for your reply, yeah, I know I addTaskLayer API and mask API, but it only add some layer on task timeline area, not in resource timeline area.

Second, if I could modify source code, how can I rebuild the source code into compiled file, I noticed there is no instructions doc or build file on this, could tell me how to do this?


Hello Kevin,
The resource timeline allows you to specify the background in the cells. Unfortunately, there is a bug so the resource grid rows don’t get correct “odd” class. It will be fixed in future versions. Here is an example of how it might work:

If you want to modify the unminified source code from the “sources” folder, then compress or compile it, you can use any tool for that. For example:


thanks Ramil for you so detailed reply, I will use your solution to give it a try, will come to tell the results, thanks Ramil


hey ramil,

It works the part of it, thanks.

a quick question, does the resource panel support smart rendering?


Hello Kevin,
The smart rendering doesn’t work in the resource panel. You can check it in the following snippet (there are resources at the bottom, but the resource cell value is still called):
The dev team will fix it in future updates.


When can I get the fixed version,?


Hello Kevin,
Unfortunately, I cannot give you any ETA. But as soon as the bug is fixed, I will notify you.