parallax/jsPDF

charSpace and maxWidth in doc.text() : charSpace > 0 and maxWidth is not respected

Open

#3299 opened on Oct 16, 2021

View on GitHub
 (5 comments) (0 reactions) (0 assignees)JavaScript (28,280 stars) (4,596 forks)batch import
Bugdifficulty:mediumhacktoberfesthelp wanted

Description

I have read and understood the contribution guidelines.

Basically, charSpace and maxWidth don't play nicely together.

Code tested using your live demo at http://raw.githack.com/MrRio/jsPDF/master/

The following works fine ...

var doc = new jsPDF();
doc.setFontSize(22);
doc.text("This is a title", 20, 20);

const maxWidth = 100;
const charSpace = 0;

// Drawing a box to show maxWidth clearly
doc.rect(20, 20, maxWidth, 100, 'S')

// Using 'justify' to show things clearly but also happens with 'left'
const options = {
    maxWidth: maxWidth,
    charSpace: charSpace,
    align: 'justify'
}
const str = "Mary had a little lamb she also had a duck. She put them on the mantlepiece to see if they would fall off."

doc.setFontSize(16);
doc.text(str, 20, 30, options);

However, if you change charSpace to 1 then maxWidth is not correctly applied and then text extends beyond the maxWidth boundary.

I can then adjust maxWidth to try and compensate for this, but the formula is not leaping off the page at me!

Contributor guide

Tech stack
javascript
Domain
frontendapi
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
JavaScriptjsPDF librarytext layout
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
60
Research direction
Examine the `doc.text()` method in jsPDF source code, likely in `src/libs/` or similar. The issue is that when `charSpace > 0` and `maxWidth` is set, the text exceeds the specified width. Look at how character spacing is applied in text rendering, possibly in the `processText` or `writeText` functions. Check issue comments for clues: one comment suggests adjusting maxWidth by subtracting charSpace * (numChars 1). Reproduce the bug using the provided code sample and verify the fix. No linked PR or assignee, so this is open for contribution.