Capability to print multiple diagrams in a single shot

[Sourangsu Dasgupta]

We have created a diagram, in which certain nodes on click event can link to a new diagram (child diagram). When I print the diagram, I want to print the whole setup, including the parent and child diagrams together. 

so, on click event of print in main diagram , the complete main diagram and all it's associated nested diagrams (one child diagram can also have similar type of node, on click event of which it can open up further child diagrams) needs to be printed . How to achieve this ?

[Gobinath Dhamotharan]

Hi Sourangsu,

We created a sample to achieve your reuirement.we use diagram.print method to print large diagram in single page by giving required options. Refer to the below documentation and sample for your reference.

Code snippet

  var options = {};

  options.stretch = 'Meet';

  options.region = 'PageSettings';

  options.pageHeight = 1000;

  options.pageWidth = 1000;

  options.pageOrientation = 'Landscape';

  options.multiplePage = false;

 

  diagram.print(options);

 

Documentation

https://ej2.syncfusion.com/documentation/diagram/export/#print

Sample

https://stackblitz.com/edit/dupg64?file=index.js

Regards,

Gobinath

[Sourangsu Dasgupta]

This is not what my requirement is , I want to understand if it's possible on click of a button to combine multiple diagrams (diagram1, diagram2, diagram3.....and so on) and on click of print get a single pdf file combining all the images.

I have a diagram1 , which links to diagram2 and diagram 2 links to diagram 3 and so on ..so is it possible to print all the diagrams in a click in a single pdf file. As per my understanding we get a base64 string for each diagram, is it possible to combine all base64 and print all of them in one pdf file

[Sivaranjith Jeyabalan]

Hi Sourangsu,

We have created a sample to achieve your requirement. In this sample we have exported the diagram data and combined it to print in single pdf.

Please find the sample and documentation link below.

Sample: https://stackblitz.com/edit/dupg64-yeivu9?file=index.js,index.html

Documentation: https://ej2.syncfusion.com/javascript/documentation/diagram/export/ 

[Sourangsu Dasgupta]

Thanks for the response, I have tried this, but the problem I am encountering is one the exported image is too large to fit in a single page, then it kind of spreads over to the next page, which is as per our expectation. But by using document.write while trying to print successive images it overwrites spilled over image. I am sharing the base64 image strings just for reference. If you can show how it's possible to download all images and print them as a single pdf without anything getting overwritten/ without reducing aspect ratio. that will be helpful.

I have hardcoded the image strings to show you the problem I am facing. Attached images

https://dupg64-7jaeyb.stackblitz.io

Attachment: PDF_da54722c.rar

[Sivaranjith Jeyabalan]

Hi Sourangsu,

We will validate and update you with more details on April 05, 2023.

[Sivaranjith Jeyabalan]

Hi Sourangsu,

We have modified the sample in which we calculated the height and width of each diagram content and used that size to print the diagram in each page. You can also customize the print options in browser default print settings as shown in the below video. Please find the video and sample below for your reference.

Sample: https://stackblitz.com/edit/dupg64-zuh9sb?file=index.js,index.html 

Attachment: printdiagram_8cb9e2a6.zip

[Sourangsu Dasgupta]

Is it possible to print individual diagram in individual pages ? as of now if the diagram is smaller multiple diagrams take up same page while printing

Edit: a diagram could be long enough such that, it cannot fit in a single page, but next diagram should start from a new page 

[Vivisa Ganesan]

Hi,

We will validate and update you with more details on April 13,2023.

Regards,

Vivisa

[Vivisa Ganesan]

Hi,

We have rendered the three diagrams. The scale value is set only for the first image, while the second and third images are rendered on multiple pages. We need to check if the scale values are correctly applied to the second and third diagrams. We will validate this and provide you with more details on April 17th, 2023.

Regards,

Vivisa

[Sivaranjith Jeyabalan]

Hi Sourangsu,

We have modified the sample and scaled each diagrams based on diagram content size in separate page. Please find the sample below.

Sample: https://stackblitz.com/edit/dupg64-dexbpo?file=index.js,index.html