Advance property in bounding box returned by textBounds

p5.js Beginners
1

The bounding box returned by textBounds() has the expected properties (x, y, h, w) and one more that surprised me: “advance”. What does it do? When would I use it? There is no documentation on this item.

Thanks!

2

The only place I’ve found prop advance is accessed is inside method textBounds() itself:

1 Like
3

Thanks for looking into that

4

It is used to help control horizontal placement of the text based on the current text alignment set by the user.

We can see that the value of result.w + result.advance is passed as the fifth parameter in the _handleAlignment method call.

The function header shows that this parameter is called textWidth
_handleAlignment(renderer, line, x, y, textWidth) {

I doubt whether you can find much use for this in your own sketches.

In my limited experience of low level font usage (Java) the term advance is used to measure the width of the text just printed and is used to advance the horizontal text drawing position for subsequent text printing.

2 Likes