Skip to content

Only Displaying One Page | Blank Pages | .html() method #2973

@RobertoUroz

Description

@RobertoUroz

Hi.

I am trying to create a new pdf via HTML element parsed from a string in a file, this file has only div and p elements.

Versions:
"jspdf": "^2.1.1"
"html2canvas": "^1.0.0-rc.7"

The thing is that the first page is shown properly but the next pages seems to be blank, the elements are still there and when I copy and paste them are being copied correctly.

This issue happens with all the apps except with adobe pdf reader.

google pdf viewer screenshot.
adobe pdf viewer screenshot..
checker pdf compliance online
Code:

function stringToHTML(str) {
        var parser = new DOMParser();
        var doc = parser.parseFromString(str, 'text/html');
        return doc;
      }
var jspdfOptions = {
        orientation: 'p',
        unit: 'pt',
        format: 'a4',
        putOnlyUsedFonts: true,
        floatPrecision: 16 // or "smart", default is 16
      }
function printingTemplate (html_string) {
        var document = this.stringToHTML(html_string);
        var element = document.body;
        element.style.cssText = "data-oj-binding-provider: none;";
        var doc = new jspdf.jsPDF(jsPDFOptions);
        element.style.fontFamily = "roboto-regular";
        var font = "...";
        doc.addFileToVFS("Roboto-Regular-normal.ttf", font);
        doc.addFont("Roboto-Regular-normal.ttf", "roboto-regular", "normal");
        doc.setFont("roboto-regular", "normal");
        doc.html(element, {
                      callback: function (doc) {
                        var pdf_base64 = doc.output('datauri');
                        console.log(pdf_base64);
                      },
              x: 20,
            });
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions