Question with Gantt Export

Hello everyone, I have 2 questions regarding the export feature:

  1. Is there a way to export the whole width of a view? In my example, I have the Gantt and the Timeline, side by side. But we can see that the Timeline columns are not all being printed on the PDF.

Test 1 - 01-27-2025 07_25 AM.pdf (66.8 KB)

  1. What is the best approach for custom CSS when we Export? I know we can pass some CSS to the method, but this seems tedious as I sometime have to replicate the same logic twice. Any hints here?

Thank you for your time.

Hello Karl,

Is there a way to export the whole width of a view? In my example, I have the Gantt and the Timeline, side by side. But we can see that the Timeline columns are not all being printed on the PDF.

This should be a bug in Gantt as all scale cells should be visible in the exported file. I see you have an old Gantt version (at least 8.0), so, probably, that bug was fixed. But I couldn’t reproduce the issue in the following snippet:
https://snippet.dhtmlx.com/f42qqo1r

It is hard to suggest what might be wrong as I don’t see your code.
Please add your configuration to the following snippet and make sure that the issue is reproduced there:

Then, click on the Save button and send me the link.
Or send me a ready demo with all the necessary JavaScript and CSS files so that I can reproduce the issue locally.

If you mean that you don’t see the vertical lines in the timeline in the exported file, this should occur if you use the raw mode and enable the static_background config. When the static_background config is enabled, Gantt creates an image instead of actual timeline cells. But that image is removed from the HTML structure of the request for security reasons. And because of that, there is no way to see the vertical lines. The dev team will try to fix that in the future, but I cannot give you any ETA.

However, if you enable the static_background config, it doesn’t improve the performance that much starting from the 7.0 or 7.1 version as the smart rendering extension was really optimized. And according to the performance tests, there is no much advantage if you enable that config. Moreover, sometimes it even decreases performance a little as generating an image still takes some time.
The only reason why you may want to use that config is to decrease the request size that is sent to the export server.


What is the best approach for custom CSS when we Export? I know we can pass some CSS to the method, but this seems tedious as I sometime have to replicate the same logic twice. Any hints here?

Unfortunately, there is no universal solution for the custom styles. To have the same styles in the PDF file, the export module should have them in the HTML page that is used to export Gantt.

If it is not convenient to get the styles from the CSS files or the style elements, you can try to use the approach of collecting styles from the DOM:
https://docs.dhtmlx.com/gantt/desktop__export.html#customstylefortheoutputfile:~:text=Collecting%20all%20styles%20for%20the%20export%20function

However, if your styles have additional selectors for the parent nodes of the Gantt container, this will not work unless you modify the styles only for the export function.

Probably, a better approach would be to use the standalone export module. There, you can modify the HTML files (templates) that are used to export Gantt. This means, you can add any style rules to the page and won’t need to include them in the export function.
However, when you update the export module to a newer version, you would need to apply the changes again.

1 Like

Hi Ramil,

You are right, the export version we we’re using was old. We updated to version 8++ last year but kept the old export workaround that was available for lower versions. Using the one out of the box seems to help.

As for the styling, this was my idea as well. WIll give it a try soon.

Thank you for your time, it is very appreciated.