exportToPDF

exports a Gantt chart into the PDF format

Parameters

export

object

optional, an object with export settings (see the details)

Example

gantt.exportToPDF();
 
//or
gantt.exportToPDF({
  name: "mygantt.pdf"
});
 
gantt.exportToPDF({
    name:"mygantt.pdf",
    header:"<h1>My company</h1>",
    footer:"<h4>Bottom line</h4>",
    locale:"en",
    start:"01-04-2013",
    end:"11-04-2013",
    skin:'terrace',
    data:{ },
    server:"https://myapp.com/myexport/gantt",
    raw:true,
    callback: function(res){
        alert(res.url);
    }
});

The exportToPDF method takes as a parameter an object with a number of properties (all of the properties are optional):

name	(string) the name of the output file
skin	('terrace', 'skyblue', 'meadow', 'broadway') the skin of the output Gantt chart
locale	(string) sets the language that will be used in the output Gantt chart
start	(string) sets the start date of the data range that will be presented in the output Gantt chart. The date format is defined by the date_format config
end	(string) sets the end date of the data range that will be presented in the output Gantt chart. The date format is defined by the date_format config
data	(object) sets a custom data source that will be presented in the output Gantt chart
header	(string) specifies the header that will be added to the output PDF image. Note, you can use any HTML here
footer	(string) specifies the footer that will be added to the output PDF image. Note, you can use any HTML here
server	(string) sets the API endpoint for the request. Can be used with the local install of the export service. The default value is https://export.dhtmlx.com/gantt
raw	(boolean) defines that all Gantt markup will be exported as it is, with all custom elements. false by default. Read the details
callback	(function) If you want to receive an url to download a generated PDF file, the callback property can be used. It receives a JSON object with the url property
additional_settings	(object) an object with additional settings. The object can contain the following attributes: format - (string) the format of the output file: 'A3', 'A4', 'A5', 'Legal', 'Letter', 'Tabloid' landscape - (boolean) the portrait or landscape orientation of the output file. The attribute works only when the "format" attribute is specified. width - (string|number|"content") the width of the output page. The attribute is used when exporting multiple pages. height - (string|number|"content") the height of the output page. The attribute is used when exporting multiple pages.

Multi-page export

When Gantt is exported, only its leftmost part is exported to the PDF document each time. Thus, to implement multi-page export, it is necessary to export Gantt several times, shifting Gantt to the left each time.

To shift Gantt in the exported file, you need to add the following style rule to #gantt_here in the header parameter:

const width = 1000;
const height = 1000;
const total_width = gantt.$task_bg.scrollWidth + gantt.$grid.scrollWidth;
 
for (let i = 0; i < total_width; i += width) {
  gantt.exportToPDF({
    header:`<style>#gantt_here{left:-${i}px;position: absolute;}</style>`,
    //raw: true,
    additional_settings:{
      width: width,
      height: height,
    }
  });
}

Related sample:  Export to the file of defined sizes

In case you want to export Gantt to the specific format ('A4', for example), note, that the file format is defined in millimeters but the size in HTML is specified in pixels. Therefore, you need to convert the shift value from millimeters to pixels.

const widthMM = 297;
const width = widthMM / (25.4 inch / 144 PDF PPI);

Related sample:  Export to the file of defined format

Note, if you export the multi-page Gantt but get only one PDF file, it means that the browser blocks the pop-ups because the function opens them simultaneously. In this case, you need to enable the pop-ups and try exporting again.

Time restrictions

If the process takes over than 20 seconds, the export will be canceled and the following error will occur:

Error: Timeout trigger 20 seconds

If several people export Gantt at the same time, the process can take more time than usual. But that's fine because the time which is spent for export request from a specific user is counted separately.

Back to top