Page loading error when exporting a PDF file using html2canvas and jsPdf

Asked

Viewed 191 times

0

Good afternoon I am developing a system that creates one or more HTML templates and exports them to PDF for creating posters.

It takes the html area for each poster, converts it to image with html2canvas, and then adds it to a PDF page with the jsPdf plugin. At the end a single PDF file with X pages should be generated according to the number of posters.

The problem is that when I try to export sheets in size A1 (which are quite large) I end up giving this error of the image below. This problem only happens when I try to export more than 5 sheets. I have tested on another micro where also presented the same problem, but it accepted more sheets (9 in total).

One point to note is that 5 sheets are generating a file of more or less 133 MB and I do not know if there is a limit due to plugins or something related.

I really have no idea what could be done in the code to solve this. The first thing I tried was to follow the tips that the browser itself suggested but did not solve. I’ve looked it up before, but I haven’t been able to find an answer yet. If anyone can at least give me some direction on what to research for me to try to solve this I’d appreciate it.

In case someone wants to view the code this is the excerpt that iterates each HTML template and generates the image.

Note: some variables have already been declared before. I preferred to show only this snippet of each.

$.each( $(".folha"), function( key, value) {
                var element = document.getElementsByClassName("folha")[key];
                html2canvas(element, {
                    logging: false,
                    async: false,
                    windowWidth: '100%',
                    windowHeight: '100%',
                    width: folha_width,
                    height: folha_height,
                    useCORS: true}).then(function(canvas) {
                        var data = canvas.toDataURL('image/png', 1);
                        var image = encodeURI(data);
                        count.remove(key);

                        if(count == null || count.length == 0){  
                            doc.addImage(image, 'PNG', 0, 0);
                            var name = 'cartazes-'+cartaz_nomes[folha_nome]+'-'+orientacao+'-com-'+paginas+'-paginas.pdf';
                            doc.save(name); 
                            display_load('none');
                        } else {
                            doc.addImage(image, 'PNG', 0, 0);
                            doc.addPage();
                        }
                });
                paginas +=1;
            });

erro de carregamento de página

  • I wonder how you solved this problem.

  • 1

    Good afternoon William, I could not solve this problem. I ended up adding the option to export image in addition to PDF. Because when exported in image works with sheets A1.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.