2017-09-03 3 views
3

In Web-Anwendung verwende ich die JSPDF Autotable, um ein PDF zu erstellen. Das Problem ist, dass die Daten dynamisch sind (ich werde AngularJS 1.x verwenden) und so können die Zeilen unterschiedliche Höhe haben.JSPDF Autotable bricht Zeilen

In einigen Fällen unterbricht Autotable die letzte Zeile der Seite und fährt mit der nächsten fort. Wie kann ich dieses Verhalten verhindern und Autotable so einrichten, dass es die letzte Zeile übernimmt (welcher Standard würde brechen) und es auf die nächste Seite bringen?

Dies ist mein Code: https://jsfiddle.net/9vgxvfkh/1/

Ich denke, muss ich im Stil einige Einstellungen ändern:

styles: { 
    cellPadding: 1.5, 
    overflow: 'linebreak', 
    valign: 'middle', 
    halign: 'center', 
    lineColor: [0, 0, 0], 
    lineWidth: 0.2 
}, 
pageBreak: 'always' 

Aber ich habe versucht, und es hat nicht funktioniert.

S.S .: Der Rand oben auf der Kopfzeile ist weil ich dann ein Bild hinzufügen werde.

+0

Bitte überprüfen Sie die aktualisierte Antwort. Ist diese Lösung für Sie akzeptabel? – luke

+0

Ja, danke! – panagulis72

Antwort

1

Leider gibt es keine Möglichkeit, dies mit einigen Parametern oder Stilen zu tun.

Ich habe ein kurzes Debuggen und eine Lösung für Ihr Problem gefunden, müssen Sie den Quellcode leicht ändern.

image

Im Quellcode fand ich, dass für jede Zeile ein Verfahren printFullRow genannt wird, nach, dass es eine Überprüfung, ob die Zeile auf der Seite (Methode canFitOnPage) passen kann, ist.

Wenn die Zeile nicht auf die Seite passen kann, wird geprüft, wie viele Textzeilen sie enthält (in meinem Fall ist es 10). Zeile wird geteilt, weil die Anzahl der Zeilen größer als 1 ist.

Sie müssen diese Zahl zu etwas größerem ändern. Um weitere Fehler zu vermeiden, müssen Sie sicherstellen, wie viele Zeilen zur gesamten Seitenhöhe passen würden und diese Zahl anstelle von 1 setzen. Wenn Sie eine enorme Menge wählen würden, im Fall von wirklich langem Text, der nicht einmal die gesamte Seite ausfüllen würde würde überhaupt nicht gerendert werden, weil common_1.addPage() endlos ausgeführt würde.

Um es zusammenzufassen, ändern Linie 470 bis etwa wie folgt:

if (row.maxLineCount <= 50) { 

Es sei denn, 50 Zeilen nicht auf Seite passen ...

Vorher: enter image description here

Nach: enter image description here

Bitte überprüfen Sie die aktualisierte Geige: https://jsfiddle.net/9vgxvfkh/2/

Verwandte Themen