v7.3.0
SupportExamplesFree Trial

PdfExport
Feature

Generates PDF/PNG files from the Gantt component.

A server-side service is required to perform the export operation. Check out PDF Export Server documentation and installation steps here

When your server is up and running, it listens to requests. The Export feature sends a request to the specified URL with the HTML fragments. The server generates a PDF (or PNG) file and returns a download link (or binary, depending on sendAsBinary config). Then the Export feature opens the link in a new tab and the file is automatically downloaded by your browser. This is configurable, see openAfterExport config.

The exportServer URL must be configured. The URL can be localhost if you start the server locally, or your remote server address.

Usage

const gantt = new Gantt({
    features : {
        pdfExport : {
            exportServer : 'http://localhost:8080' // Required
        }
    }
})

// Opens popup allowing to customize export settings gantt.features.pdfExport.showExportDialog();

// Simple export gantt.features.pdfExport.export({ // Required, set list of column ids to export columns : gantt.columns.map(c => c.id) }).then(result => { // Response instance and response content in JSON let { response, responseJSON } = result; });

Configuring the export dialog

To learn about how to customize the export dialog and its default widgets, please refer to the SchedulerExportDialog which provides a 'ref' identifier for each child widget so that you can customize them all based on your requirements.

Loading resources

If you face a problem with loading resources when exporting, the cause might be that the application and the export server are hosted on different servers. This is due to Cross-Origin Resource Sharing (CORS). There are 2 options how to handle this:

  • Allow cross-origin requests from the server where your export is hosted to the server where your application is hosted;
  • Copy all resources keeping the folder hierarchy from the server where your application is hosted to the server where your export is hosted and setup paths using translateURLsToAbsolute config and configure the export server to give access to the path:
const gantt = new Gantt({
    features : {
        pdfExport : {
            exportServer : 'http://localhost:8080',
            // '/resources' is hardcoded in WebServer implementation
            translateURLsToAbsolute : 'http://localhost:8080/resources'
        }
    }
})
// Following path would be served by this address: http://localhost:8080/resources/
node ./src/server.js -h 8080 -r web/application/styles

where web/application/styles is the physical root location of the copied resources, for example:

This feature is disabled by default. For info on enabling it, see GridFeatures.

No results

Configs

Configs are options you supply in a configuration object when creating an instance of this class
  • Internal listeners, that cannot be removed by the user.

  • fileFormat : 'pdf'/'png'pdf
    PdfExport

    Format of the exported file, either pdf or png.

  • Name of the exported file.

  • orientation : 'portrait'/'landscape'portrait
    PdfExport

    Orientation. Options are portrait and landscape.

  • paperFormat : 'A0'/'A1'/'A2'/'A3'/'A4'+ 3 moreA4
    PdfExport

    Export paper format. Available options are A1...A5, Legal, Letter.

  • Exported time span range end. Used with daterange config of the scheduleRange

  • Exported time span range start. Used with daterange config of the scheduleRange

  • rowsRange : 'all'/'visible'all
    PdfExport

    Specifies which rows to export. all for complete set of rows, visible for only rows currently visible.

  • scheduleRange : 'completeview'/'currentview'/'daterange'completeview
    PdfExport

    Specifies how to export time span.

    • completeview - Complete configured time span, from scheduler start date to end date
    • currentview - Currently visible time span
    • daterange - Use specific date range, provided additionally in config. See rangeStart/ rangeEnd
  • The widget which this plugin is to attach to.

    Has a corresponding runtime client property.

  • Set to false to disable localization of this object.

  • Set to true to align row top to the page top on every exported page. Only applied to multipage export.

  • Export server will navigate to this url first and then will change page content to whatever client sent. This option is useful with react dev server, which uses a strict CORS policy.

  • A config object to apply to the SchedulerExportDialog widget.

    Has a corresponding runtime exportDialog property.

  • exportMask : String"Generating pages..."
    PdfExport

    A message to be shown when Export feature is performing export.

  • exportProgressMask : String"Waiting for response from server..."
    PdfExport

    A message to be shown when export is almost done.

  • URL of the print server.

  • Config for exporter.

  • exporterType : 'singlepage'/'singlepageunscaled'/'multipage'/'multipagevertical'/Stringsinglepage
    PdfExport

    Type of the exporter to use. Should be one of the configured exporters

  • exporters : Exporter[]["SinglePageExporter","SinglePageUnscaledExporter","MultiPageExporter","MultiPageVerticalExporter"]
    PdfExport

    List of exporter classes to use in export feature

  • An object containing the Fetch options to pass to the export server request. Use this to control if credentials are sent and other options, read more at MDN.

  • When true links are converted to absolute by combining current window location (with replaced origin) with resource link. When false links are converted by combining new origin with resource link (for angular)

  • Defines if printed/exported page should contain @page style with paper size and orientation specified.

  • When true, page will attempt to download generated file.

  • False to open in the current tab, true - in a new tab

  • Set to true to show column headers on every page. This will also set alignRows to true. Only applies to MultiPageVertical exporter.

  • Set to true to receive binary file from the server instead of download link.

  • Set to false to not show Toast message on export error.

  • When true, export feature will use an iframe and browser's default print dialog, which allows saving as PDF. Content is optimized for chrome/edge to exact page size in the specified orientation and no margins. If you only see grid header or blank pages, try using different scale value in the print dialog NOTE: Not supported in Safari. Print works, but Safari cannot seem to fit content to one page correctly.

  • This config forces exporter to always use rendered column width. Used by Agenda view in Calendar

  • Determines whether to stream exported pages directly to the export server using WebSocket connection to offload client application. false - use legacy mode which first collected all pages locally and then passed them in a single request true - stream pages directly to the server null (default) - ask export server for WebSocket support and use it if possible

    Has a corresponding runtime webSocketAvailable property.

  • Maximum time in ms to wait for the response over the websocket connection

    Has a corresponding runtime webSocketRequestTimeout property.

Properties

Properties are getters/setters or publicly accessible variables on this class
  • isEvents : Booleantrue
    READONLY
    static
    ADVANCED
    Events
    Identifies an object as an instance of Events class, or subclass thereof.
  • isLocalizable : Booleantrue
    READONLY
    static
    ADVANCED
    Localizable
    Identifies an object as an instance of Localizable class, or subclass thereof.
  • isPdfExport : Booleantrue
    READONLY
    static
    ADVANCED
    Identifies an object as an instance of PdfExport class, or subclass thereof.
  • properties : Object
    internal
    static
    InstancePlugin

    A class property getter for the default values of internal properties for this class.

  • emptyArray : Array
    internal
    READONLY
    InstancePlugin

    An empty array that can be used as a default value.

  • emptyObject : Object
    internal
    READONLY
    InstancePlugin

    An empty object that can be used as a default value.

  • isInstancePlugin : Booleantrue
    READONLY
    ADVANCED
    InstancePlugin
    Identifies an object as an instance of InstancePlugin class, or subclass thereof.
  • isPdfExport : Booleantrue
    READONLY
    ADVANCED
    Identifies an object as an instance of PdfExport class, or subclass thereof.
  • config : Object
    READONLY
    ADVANCED
    InstancePlugin

    Returns a copy of the full configuration which was used to configure this object.

  • This property is set to true before the constructor returns.

  • isDestroying : Boolean
    READONLY
    ADVANCED
    InstancePlugin

    This property is set to true on entry to the destroy method. It remains on the objects after returning from destroy(). If isDestroyed is true, this property will also be true, so there is no need to test for both (for example, comp.isDestroying || comp.isDestroyed).

  • client : Widget
    READONLY
    ADVANCED
    InstancePlugin

    The Widget which was passed into the constructor, which is the Widget we are providing extra services for.

    Has a corresponding client config.

  • Get the global LocaleHelper

  • Get the global LocaleManager

  • When export is started from GUI (ExportDialog), export promise can be accessed via this property.

  • Returns the instantiated export dialog widget as configured by exportDialog

    Has a corresponding exportDialog config.

  • This yields true if an export/print operation is ongoing.

  • Determines whether to stream exported pages directly to the export server using WebSocket connection to offload client application. false - use legacy mode which first collected all pages locally and then passed them in a single request true - stream pages directly to the server null (default) - ask export server for WebSocket support and use it if possible

    Has a corresponding webSocketAvailable config.

  • Maximum time in ms to wait for the response over the websocket connection

    Has a corresponding webSocketRequestTimeout config.

Functions

Functions are methods available for calling on the class
  • onClassMixedIn( )
    internal
    static
    InstancePlugin

    This optional class method is called when a class is mixed in using the mixin() method.

  • initClass( )
    static
    ADVANCED
    InstancePlugin

    Registers this class type with its Factory

  • Internal function used to hook destroy() calls when using thisObj

  • Internal function used restore hooked destroy() calls when using thisObj

  • doDestroy( )
    internal
    Events

    Auto detaches listeners registered from start, if set as detachable

  • once( )
    private
    Events

    Internal function used to run a callback function after an event is triggered

  • Removes all listeners registered to this object by the application.

  • This will merge a feature's (subclass of InstancePlugin) keyMap with it's client's keyMap.

Events

Events are triggered for certain actions in this class and can be listened for to react to those actions in your code

Event handlers

Event handlers are callbacks called as a result of certain actions in this class
id: pdfExport

Source path

Gantt/feature/export/PdfExport.js

Contents