parallax/jsPDF

Missing several line of text when using html() with autopaging: text

Open

#3 393 ouverte le 18 mars 2022

Voir sur GitHub
 (13 commentaires) (7 réactions) (0 assignés)JavaScript (4 596 forks)batch import
Bugdifficulty:mediumhelp wanted

Métriques du dépôt

Stars
 (28 280 stars)
Métriques de merge PR
 (Aucune PR mergée en 30 j)

Description

I'm facing an issue when using html() function to print out a html element.

This is my code:

await doc.html(contentRef.current, {
  margin: [MARGIN_TOP, 0, MARGIN_BOTTOM, 0],
  autoPaging: 'text', // I think this property is the cause
  y: 30, // distance metadata to header (84pt) - margin top (54pt)
  html2canvas: {
    scale: 1.0,
    ignoreElements: element => element.id === autoTableConfig?.elementId,
  },
})

/// pdf save....

This is content displaying the my DOM MY TREES, AND BUT A FEW STRAY GLEAMS STEAL INTO THE INNER SANCTUARY, I THROW MYSELF DOWN

When I set autoPaging = text The output pdf will be: As you see, we miss the text line EU PEDE MOLLIS PRETIUM. INTEGER TINCIDUNT. CRAS DAPIBUS. VIVAMUS ELEMENTUM SEMPER NISI.

Then I tried switching to slice mode, now the text line is rendered, but it's sliced and put on 2 different pages. This is not our expectation :(

I'm wondering if it is a problem when calculating the possition to render the next line of Context2D when a text line is cut off. I don't have any idea to fix it so far.

Hope to see your help soon

Guide contributeur

Direction de recherche
Étudiez le mode autoPaging 'text' dans le plugin html de jsPDF. Concentrez vous sur la manière dont les sauts de ligne et les sauts de page sont déterminés. Examinez le code source dans les modules liés à la conversion html et à la pagination (par exemple, jspdf.plugin.html.js). Le problème mentionne que le mode slice fonctionne mais coupe le texte, tandis que le mode text manque des lignes. Vérifiez le calcul des coordonnées lorsqu'une ligne est coupée. Il y a des commentaires dans l'issue (#3393) suggérant des problèmes similaires. L'objectif est de s'assurer que toutes les lignes de texte sont rendues correctement lorsque autoPaging est défini sur 'text'.
Stack technique
javascript
Domaine
frontend
Type d'issue
Bug
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
3
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
1-3 heures
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
Active
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
Claire
Prérequis
JavaScript
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
60