[ANGULAR] Pdf export when gantt.zoomToFit make the exported file header urgly

[huy.le]

I have a video in attachment, i use your example but add "Zoom To Fix" button.
I move the separator to make the timeline gets narrow, then click on zoom to fix button, and do export pdf. you can take a look at the video and see, the exported file so weird, and the header is bad. I have an attachment for our header.

here is the code i added, and the example i used:
https://bryntum.com/products/gantt/examples/export/

see the video where i put it

 {
            type : 'button',
            ref  : 'exportButton',
            icon : 'fa-file-export',
            text : 'Fit',
            onClick() {
                 gantt.zoomToFit({
                    leftMargin: 50,
                    rightMargin: 50
                });
            }
        },
        

[Maxim Gorkovsky]

Hello.
Could you please elaborate? Why is it weird? What doesn't look correct to you and how you expect it to look?

When you export and do not specify a date range, current date range is used. Then exporter would take the rendered document and fit it to the page. Since the page is bigger than the rendered HTML, content will be zoomed in.

[huy.le]

Hi,

the weird thing happens when i call method gantt.zoomToFit(). then moving the separator of the grid and gantt to right, then do export, only select name column. Like my video, the export file with big text, everything gets big. if i move the separator to left, then do export, same export option. the export file gets different the last export.

My expectation the timeline should be the same event i move the separator. because i only select the name column, and the timeline should expand.

You can see the export files in the attachment. Same data, but they're different when moving the separator.

[Maxim Gorkovsky]

They differ because zoomToFix will behave different depending on the size of the scheduling view. If you make view narrow then larger view preset is used - year and quarter. If you make it wider - month and week preset is used. Calling export without a date range just uses current view preset and date range. Calling export with a specific view preset is not supported.

[huy.le]

Hello, Thank you for the reply.

When you mention the view preset. I tried to set the preset when export and i see it works although it is not official configuration. Hopefully Bryntum can support it when do exporting or printing.

beforePdfExport: () => {
                    if (this.isPublicGantt) {
                        return;
                    }

                const showHideValue = this.timeAxisHeaderMenuValue.get(this.timeHeaderMenuCurrentTimeLine);
                if (showHideValue) {
                    this.showHideTimeRangeVisual(this.timeHeaderMenuCurrentTimeLine, false);
                }

                const viewPreset = this.ganttComponent.instance.viewPreset;

                this.ganttComponent.instance.viewPreset = 'weekAndMonth';

                setTimeout(() => {
                    if (showHideValue) {
                        this.showHideTimeRangeVisual(this.timeHeaderMenuCurrentTimeLine, true);
                    }

                    this.ganttComponent.instance.viewPreset = viewPreset;
                }, 500);
            }