экспортирует диаграмму Ганта в формат PDF
export | object | необязательный, объект с настройками экспорта (см. детали) |
gantt.exportToPDF();
//или
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);
}
});
Этот метод определен в расширении export, поэтому вам нужно активировать плагин export_api. Подробности читайте в статье Экспорт в PDF и PNG.
Если вы используете версию Gantt старше 8.0, вам нужно включить https://export.dhtmlx.com/gantt/api.js на вашей странице, чтобы активировать онлайн-сервис экспорта, например:
<script src="codebase/dhtmlxgantt.js"></script>
<script src="https://export.dhtmlx.com/gantt/api.js"></script>
Метод exportToPDF принимает в качестве параметра объект с рядом свойств (все свойства необязательные):
name | (string) имя выходного файла |
skin | ('terrace', 'skyblue', 'meadow', 'broadway') скин выходной диаграммы Ганта |
locale | (string) устанавливает язык, который будет использоваться в выходной диаграмме Ганта |
start | (string) устанавливает начальную дату диапазона данных, который будет представлен на выходной диаграмме Ганта. Формат даты определяется конфигурацией date_format |
end | (string) устанавливает конечную дату диапазона данных, который будет представлен на выходной диаграмме Ганта. Формат даты определяется конфигурацией date_format |
data | (object) устанавливает источник данных, который будет представлен на выходной диаграмме Ганта |
header | (string) указывает заголовок, который будет добавлен к изображению выходного PDF. Обратите внимание, здесь можно использовать любой HTML |
footer | (string) указывает нижний колонтитул, который будет добавлен к изображению выходного PDF. Обратите внимание, здесь можно использовать любой HTML |
server | (string) устанавливает API endpoint для запроса. Может быть использован с локальной установкой сервиса экспорта. Значение по умолчанию https://export.dhtmlx.com/gantt |
raw | (boolean) определяет, что весь Gantt разметка будет экспортирована как есть, со всеми пользовательскими элементами. false по умолчанию. Подробнее |
callback | (function) Если вы хотите получить URL для загрузки сгенерированного PDF файла, можно использовать свойство callback. Оно получает JSON объект со свойством url |
additional_settings | (object) объект с дополнительными настройками. Объект может содержать следующие атрибуты:
|
Сервис экспорта имеет ограничения по времени.
Если процесс занимает более 20 секунд, экспорт будет отменен, и произойдет следующая ошибка:
Error: Timeout trigger 20 seconds
Если несколько человек экспортируют Gantt одновременно, процесс может занять больше времени, чем обычно. Но это нормально, так как время, затраченное на запрос экспорта от конкретного пользователя, учитывается отдельно.
Если вам нужно экспортировать большие диаграммы, вы можете использовать автономный модуль экспорта. Модуль экспорта предоставляется бесплатно, если вы приобрели Gantt по лицензии Commercial, Enterprise или Ultimate, или вы можете приобрести модуль отдельно.
Обратите внимание, что модуль экспорта не имеет технических возможностей для выполнения следующих задач:
Поэтому для выполнения вышеописанных задач необходимо применять пользовательские решения. Некоторые из них предоставлены ниже.
Для экспорта на несколько страниц в один файл вы можете использовать либо онлайн-сервис экспорта (с ограничениями по времени), либо автономный модуль экспорта (без ограничений). Все, что вам нужно сделать, это использовать атрибут merge_pages объекта additional_settings:
gantt.exportToPDF({
additional_settings: {
merge_pages: true, format: "A4"
}
});
Сервис экспорта подходит, если диаграмма не очень большая. Если диаграмма большая, данные будут экспортированы частично. В этом случае вы можете выполнить несколько экспортов данных вручную или использовать модуль экспорта. Модуль экспорта экспортирует все данные самостоятельно и предоставит один файл со всеми страницами.
Related sample: Экспорт на несколько страниц в один файл
Недостатком этого метода является то, что экспорт данных занимает намного больше времени, чем экспорт всех данных на одной странице. Чтобы потратить меньше времени на экспорт данных Gantt, вы можете изменить уровень Zoom и отобразить данные в неделях, месяцах или годах, так как тогда Gantt займет меньше ширины и вы будете применять экспорт меньшее количество раз.
Подробный обзор экспорта на несколько страниц в один PDF файл можно найти в связанной статье блога.
Поскольку размеры диаграммы Ганта почти всегда превышают стандартные размеры документа, диаграмма занимает более одной страницы, чтобы поместиться на ней. Когда Gantt экспортируется, каждый раз экспортируется только его самая левая часть в PDF документ. Таким образом, для реализации экспорта на несколько страниц необходимо экспортировать Gantt несколько раз, каждый раз сдвигая Gantt влево.
Чтобы сдвинуть Gantt в экспортируемом файле, вам нужно добавить следующее правило стиля к #gantt_here в параметре header:
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: Экспорт в файл определенных размеров
В случае, если вы хотите экспортировать Gantt в конкретный формат ('A3', например), обратите внимание, что формат файла определяется в миллиметрах, но размер в HTML указан в пикселях. Поэтому вам нужно преобразовать значение сдвига из миллиметров в пиксели.
const widthMM = 297;
const width = widthMM / (25.4 дюйма / 96 PDF PPI);
Related sample: Экспорт в файл определенного формата
Обратите внимание, если вы экспортируете многостраничный Gantt, но получаете только один PDF файл, это означает, что браузер блокирует всплывающие окна, так как функция открывает их одновременно.
В этом случае вам нужно включить всплывающие окна и попробовать экспортировать снова.
Вы можете включить отображение заголовков timeline и grid на каждой странице в экспортируемом файле с помощью атрибута fixed_headers объекта additional_settings. Обратите внимание, что эта функция работает только с включенным атрибутом merge_pages:
gantt.exportToPDF({
additional_settings: {
merge_pages: true, fixed_headers: true, format: "A4"
}
});
Related sample: Экспорт на несколько страниц с заголовками timeline и grid на каждой странице
В случае, если вам нужно сделать это без конфигурации, например, если вы хотите выполнить несколько операций экспорта и объединить файлы вручную, вы можете использовать следующие стили:
.grid_cell .gantt_grid_scale,
.timeline_cell .gantt_task_scale {
position: fixed;
top:0;
z-index:99999;
}