All docs
V24.1
24.2
24.1
23.2
23.1
22.2
22.1
21.2
The page you are viewing does not exist in version 21.2.
21.1
The page you are viewing does not exist in version 21.1.
20.2
The page you are viewing does not exist in version 20.2.
20.1
The page you are viewing does not exist in version 20.1.
19.2
The page you are viewing does not exist in version 19.2.
19.1
The page you are viewing does not exist in version 19.1.
18.2
The page you are viewing does not exist in version 18.2.
18.1
The page you are viewing does not exist in version 18.1.
17.2
The page you are viewing does not exist in version 17.2.

jQuery/JS Common - Object Structures - PdfExportGanttProps - font

Specifies the font.

Specify the font property in the exportGantt method to use a custom font in the exported Gantt data. The fontObject and name properties are required.

jQuery
index.js
Roboto-BoldItalic.js
DevExpress.pdfExporter.exportGantt(
  {
    component: ganttInstance,
    createDocumentMethod: (args) => new jsPDF(args),
    font: {
        fontObject: myfont,
        name: 'Roboto-BoldItalic',
    }
  },
).then((doc) => {
  doc.save('gantt.pdf');
});
// ===== or when using modules =====
import { exportGantt as exportGanttToPdf } from 'devextreme/pdf_exporter';
exportGanttToPdf(
  {
    component: ganttInstance,
    createDocumentMethod: (args) => new jsPDF(args),
    font: {
        fontObject: myfont,
        name: 'Roboto-BoldItalic',
    }
  },
).then((doc) => doc.save('gantt.pdf'));
var myfont = 'AAEAAAAS...';
Angular
app.component.ts
Roboto-BoldItalic.js
import { exportGantt as exportGanttToPdf } from 'devextreme/pdf_exporter';
exportGanttToPdf(
  {
    component: ganttInstance,
    createDocumentMethod: (args) => new jsPDF(args),
    font: {
        fontObject: myfont,
        name: 'Roboto-BoldItalic',
    }
  },
).then((doc) => doc.save('gantt.pdf'));
var myfont = 'AAEAAAAS...';
Vue
App.vue
Roboto-BoldItalic.js
import { exportGantt as exportGanttToPdf } from 'devextreme/pdf_exporter';
exportGanttToPdf(
  {
    component: ganttInstance,
    createDocumentMethod: (args) => new jsPDF(args),
    font: {
        fontObject: myfont,
        name: 'Roboto-BoldItalic',
    }
  },
).then((doc) => doc.save('gantt.pdf'));
var myfont = 'AAEAAAAS...';
React
App.js
Roboto-BoldItalic.js
import { exportGantt as exportGanttToPdf } from 'devextreme/pdf_exporter';
exportGanttToPdf(
  {
    component: ganttInstance,
    createDocumentMethod: (args) => new jsPDF(args),
    font: {
        fontObject: myfont,
        name: 'Roboto-BoldItalic',
    }
  },
).then((doc) => doc.save('gantt.pdf'));
var myfont = 'AAEAAAAS...';

fontObject

A custom font object.

Type:

Object

Default Value: undefined

Use the jsPDF font converter to generate a custom font object. Specify font settings and load your font file (.ttf). The converter generates a .js file with the content of your font file.

DevExtreme Gantt - Custom Font for PDF Export

Add the generated .js file or only a base64-encoded string from this file to your project to export data with your font.

Refer to the font property description for the example.

name

The font name.

Type:

String

Default Value: undefined

style

The font style.

Type:

String

Default Value: 'normal'
Accepted Values: 'bold' | 'normal' | 'italic'

weight

The font weight.

Type:

String

|

Number

Default Value: undefined
Accepted Values: 'normal' | 'bold' | 400 | 700