microsoft / microsoft/maker.js
Path directions for text are unpredictable
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 2k
- Forks
- 302
- Avg merge
- 21h 28m
- Merged PRs (30d)
- 5
Description
I'm using maker.js to generate designs for laser cutting. I've noticed an issue with way text gets rendered to SVG, and it appears to me to be a bug, though I'm hoping there's a workaround, and it might be that there is something that I'm doing wrong.
I'm loading fonts using opentype.js and rendering the text as curves, and exporting to SVG. I'm finding that the directions of paths are not preserved from the glyphs and are unpredictable, resulting in inner paths that are not always the correct direction for the non-zero fill mode, regardless of which fillRule option is used when exporting to SVG. This is a problem because some laser software (Glowforge) doesn't honor fill rules, and always treats curves as non-zero while engraving (though it honors the fill rule when previewing in the interface, so the issue is not seen until the engrave goes wrong).
When opentype parses the font, the directionality of each curve is preserved. But after creating a makerjs.model.Text model from the font, the path directions are inconsistent. This can even be seen in the examples in the playground that use text.

I believe this is why directions are unpredictable when the models get exported to SVG paths. So I have two questions:
- How difficult would it be to fix this in the text model so path directions are maintained when the model is created?
- Is there a document best workaround with the current version to fix path directions? I started writing my own fixChains function using
makerjs.model.findChains(model, { contain: { alternateDirection: true } }), but it's not functional yet, and it seems like this is something that should already be somewhere in the code base already.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with makerjs.model.Text and compare the path directions produced from opentype.js glyphs with the directions seen during SVG export. Review the existing makerjs.model.findChains workaround mentioned in the issue, then verify that generated text paths preserve the intended inner and outer directions for non-zero filling and laser engraving.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- computer-graphics
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100