Экспорт страницы с множеством графиков Кендо в PDF-файл размером с букву - PullRequest
Новая
       4

Экспорт страницы с множеством графиков Кендо в PDF-файл размером с букву

1 голос
/ 20 мая 2019

Я пытаюсь экспортировать веб-страницу с использованием HTML / CSS и около 19 диаграмм в многостраничный PDF-формат.

Пока он может экспортировать всю веб-страницу на 1 непрерывной странице, однако при печати он будет уменьшен до 1 страницы.

Ниже приведен javascript для экспорта в PDF, настройки размера бумаги, полей и принудительного разрыва страницы на всех элементах div, расположенных между областями диаграммы.

Нужно ли что-то объявлять в самой диаграмме кендо JS? 

$("#export-pdf").click(function () {
    // Convert the DOM element to a drawing using kendo.drawing.drawDOM
    kendo.drawing.drawDOM($(".content-wrapper"))
        .then(function (group) {
             // Render the result as a PDF file
             return kendo.drawing.exportPDF(group, {
                 paperSize: "a4",
                 margin: "2cm",
                 // Page Break divs between each partial with a kendo chart
                 forcePageBreak: ".page-break"
             });
        })
        .done(function (data) {
            // Save the PDF file
            kendo.saveAs({
                dataURI: data,
                fileName: "exportPDF")).pdf",
            });
        });

С JS выше, он показывает что-то действительно странное:

1/4 от верхней части веб-страницы, увеличенной и обрезанной до страницы размера буквы. Выпускается только 1 страница.

Мы пытаемся заставить функцию pdf экспорта kendo взять все в «обертке содержимого» и поместить ее на несколько страниц размером букв, чтобы ее можно было распечатать и разборчиво.

Любая помощь или понимание приветствуется !!

1 Ответ

0 голосов
/ 23 мая 2019

У меня были "pageSize" "margin" и "forcePageBreak" в неправильном разделе - он должен был быть в событии drawDom, чтобы работать.

Исправленный код: 

$("#export-pdf").click(function () {
    // Convert the DOM element to a drawing using kendo.drawing.drawDOM
    kendo.drawing.drawDOM(".content-wrapper", {
                 paperSize: "a4",
                 margin: "2cm",
                 // Page Break divs between each partial with a kendo chart
                 forcePageBreak: ".page-break"
    })
        .then(function (group) {
             // Render the result as a PDF file
             return kendo.drawing.exportPDF(group);
        })
        .done(function (data) {
            // Save the PDF file
            kendo.saveAs({
                dataURI: data,
                fileName: "exportPDF")).pdf",
            });
        });
...