Progress® Kendo UI® for jQuery Feedback Portal
Back to Feed
Request a Feature Report a Bug
Unplanned
Last Updated: 23 Jul 2020 12:11 by ADMIN
Oleksii
Created on: 16 Jul 2020 08:58
Category: Drawing API
Type: Feature Request
2
Export several web/DOM pages into single PDF file

Hello.
We currently use
kendo.drawing.drawDOM
kendo.drawing.exportPDF
kendo.saveAs

to export the whole web page to PDF file.

But now there is a new task to create single PDF export file containing several web pages of our application.
I have already found that there is a possibility to create multi-page PDF using "multiPage" parameter


kendo.drawing.exportPDF(root, {
    paperSize: [1070, height],
    multiPage: true,
});

 

Also I found out that it is possible to append new Group to MasterGroup object using "append" method (https://docs.telerik.com/kendo-ui/api/javascript/drawing/group/methods/append)


kendo.drawing.drawDOM(element, {
    scale: 0.65
}).then(function (root) {
    pdfMasterGroup.append(root);
    return kendo.drawing.exportPDF(pdfMasterGroup, {
        paperSize: [1070, height],
        multiPage: true,
    });
});


The problem is I don't know how to save Group object when another web page is loaded. I tried to convert Group object to JSON string using

JSON.stringify(root)


JSON.stringify(root)

But this command fails due to circular structure of object


Uncaught TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'init'
    |     property 'options' -> object with constructor 'init'
    |     property '_observers' -> object with constructor 'Array'
    --- index 0 closes the circle
    at JSON.stringify (<anonymous>)

Have you faced such a problem? Is the a way to populate single PDF with several web/DOM pages?

9 comments
ADMIN
Plamen
Posted on: 23 Jul 2020 12:11

Hello,

I have converted the thread into a feedback issue in our Kendo feedback portal. 

Regards,
Plamen
Progress Telerik

Oleksii
Posted on: 23 Jul 2020 08:45

Thank you, Plamen.

I think we can close the ticket. Not sure if it could be marked as resolved. Perhaps it could be converted into future enhancement, if possible.

ADMIN
Plamen
Posted on: 22 Jul 2020 13:08

Hi,

Yes - unfortunately it is a limitation of kendo drawing functionality indeed.

If you have further questions please don't hesitate to contact us again.

Regards,
Plamen
Progress Telerik

Oleksii
Posted on: 21 Jul 2020 13:11

Yes, I saw that limitation mentioned.

But I thought SVG representing Kendo chart is exception to the limitations, because it works in our application now (when we export it from normal non-iframe page).

So, it appears that it is impossible to populate single PDF file with multiple web/DOM pages. Am I right?

I'm taking into consideration what we discussed here:

  • it is impossible to use iframes to append several pages (Group objects) into masterGroup object;
  • Group object "can't be somehow stored in local storage or somewhere so that it can be used after several page loads"


ADMIN
Plamen
Posted on: 21 Jul 2020 12:06

Hi,

Thank you for sharing the exact code. It seems like I could not understand the scenario correctly in my previous reply- please excuse me for that.

The content of the <iframe> and <svg> elements is not processed by the drawing and  it will not be exported by the Drawing API as it is described here.

It seems like this is the limitation that is hit here - in such case we would rather recommended avoiding the usage of iframe.

Hope this information will be helpful. If you have further questions please let me know.

Regards,
Plamen
Progress Telerik

Oleksii
Posted on: 20 Jul 2020 12:42

I tried to use iframes to populate PDF with multiple pages, but I faced problem with exporting charts (Area charts, Line charts).

I can't share real app here, but I reproduced issue in HTML files (I didn't find possibility to use iframes in Dojo). There are two files:

  • "index.html" - the main one,
  • "iframe.html" - file for iframe.

They need to be launched on real domain locally to avoid cross-origin issues.

So, JavaScript error occurs on attempt to "exportPDF(group)" the group received from iframe:

Uncaught TypeError: Cannot read property 'bbox' of undefined

This error occurs only when chart is located inside iframe. When chart is located on the same page no error occurs.

I also tried to narrow down the blocks types that cause the issue. In my case the problem is in drawing Kendo Area charts, Kendo grid renders normally even from iframe.

Attached Files:
ADMIN
Plamen
Posted on: 17 Jul 2020 10:33

Hi,

The drawDOM element needs a jQuery DOM element as it is described in the API reference here. '$("#page-iframe-wrapper iframe")' is the part of the code that is searching the element that we need to draw  so as  long as it is returning the correct element we can use pass it to the drawDOM element. 

You can also review this documentation article where are listed the limitations of the drawing scenarios - https://docs.telerik.com/kendo-ui/framework/drawing/limitations-browser-support.

Regards,
Plamen
Progress Telerik

Oleksii
Posted on: 16 Jul 2020 14:47

Thank you, Ianko.

I'll try to use iframe, as far as I understand there is no other way to accomplish this.

Should "iframe" element be used as parameter for "drawDOM" method?


kendo.drawing.drawDOM($("#page-iframe-wrapper iframe"));

ADMIN
Ianko
Posted on: 16 Jul 2020 11:22

Hello Oleksii,

The drawDOM uses nodе representation that has a hierarchical nature and this is why it cannot be represented as JSON. Also it cannot be somehow stored in local storage or somewhere so that it can be used after several page loads. 

A possible solution is to have an iframe loading the pages one by one and use the append method to add them to the drawing context.

Regards,
Ianko
Progress Telerik

Create an account Log In
View
Type
Status
Category