[2.0] Typography questions and possible bugs

[shiffman]

Most appropriate sub-area of p5.js?

• Accessibility
• Color
• Core/Environment/Rendering
• Data
• DOM
• Events
• Image
• IO
• Math
• Typography
• Utilities
• WebGL
• Build process
• Unit testing
• Internationalization
• Friendly errors
• Other (specify if possible)

p5.js version

2.1.0-rc

Web browser and version

Version 141.0.7390.56 (Official Build) (arm64)

Operating system

MacOSX

Questions and Discussion

I am working on finishing a video (edited out of a live stream) about the new typography features in p5.js 2.0. Following are some issues/questions I encountered while making new examples and exploring the new features. I'll cover them all in this one issue, but would be happy to break them out separately if that is more helpful.

textToPoints()

Is textToPoints() still recommended to use for some cases? Is it deprecated? I am covering the new textToContours() but see that textToPoints() is still in the reference. Is the only difference is that it is a single array instead of array "per contour"?

loading font via URL or file

I understand that textToContours() will not work with a variable weight font, however, is it also true that it will only work with loading the font file directly (uploading to p5 web editor)? I tried loading a font from a URL with fixed weights and it does not work, however, loading the ttf file directly does work.

font = await loadFont("https://fonts.googleapis.com/css2?family=Grenze+Gotisch&family=STIX+Two+Text&display=swap");

Also, the friendly error message incorrectly references textToPath(), perhaps this was the naming in earlier versions of p5 2?

simplifyThreshold

I am not able to get the simplifyThreshold property to work. Using a textSize() of 24 or higher and any angle other than 0.0 I get the error message:

ReferenceError: collinear is not defined

Here is a small sketch to show the error: https://editor.p5js.org/codingtrain/sketches/4_L_Uq_5Y

angle vs. alpha

The reference for textToContours() states:

Each point object in a contour array has three properties that describe the point's location and orientation, called its path angle. For example, { x: 10, y: 20, alpha: 450 }.

However, I see both an alpha and angle property. Is this intended?

For context, here is the full example from my video:

https://editor.p5js.org/codingtrain/sketches/e2_aSyk-U

[davepagurek]

Thanks for helping test out these features @shiffman!

textToPoints

The only difference is that it's a flat array, yep! If you're just doing something like drawing shapes around the text, or maybe checking the distance to text by comparing a point to different points on the text, then using the flat textToPoints output is probably a little simpler. But in general textToContours will be more flexible.

loading font via URL or file

Google Fonts are in the woff2 format generally, which p5 doesn't support out of the box, but we have an external addon for: https://github.com/davepagurek/p5.woff2 Does including this get your sketch to work? (It would be great to include this in p5 at some point, but annoyingly the existing woff2 parsing/decompression libraries add a lot to the bundle size of p5 builds, so for now it's external.)

For the weird mention of textToPaths in the error: I think the problem is the same as this #8174 where FES has an off-by-one error causing it to look too deep into the call stack and is incorrectly reporting the function your sketch called to trigger the error, as textToPaths is an internal method. I have a PR up to fix that so I think this should get addressed too!

simplifyThreshold

That's a bug, thanks for catching it! I put up a PR: #8178

angle vs alpha

The path angle used to be called alpha in 1.x, but I started transitioning to the hopefully more understandable angle in #7434, keeping alpha as an alias for backwards compatibility. I feel like there was some discussion about this somewhere but it wasn't on that PR, @ksen0 do you remember if I talked to you about that? It also looks like the text docs were never updated if we did want to finish that rename from alpha to angle, which I can do if we think that's the right call (still keeping alpha around since it's been in the docs for a bit now, but just deprecated.)