Node / Text Rendering · guide
Paint order & renderer structure
Current Apexify.js 6.0.0 documentation for Paint order & renderer structure.
This page describes EnhancedTextRenderer.renderText (lib-next/text/enhanced-text-renderer.ts), which createText and renderTextsOntoContext rely on.
Outer scope
Each TextProperties layer wraps rendering in ctx.save() / ctx.restore().
| Stage | Function | Notes |
|---|---|---|
| Font file | registerTextFontFromPath | Runs when font.path (**or fontPath) present |
| Motion / alpha | applyTextTransformations | Rotation around (x,y), then fill.opacity → globalAlpha |
| Typography | setupTextFont | CSS font string + letterSpacing / wordSpacing |
| Anchor | setupTextAlignment | textAlign, textBaseline |
| Branch | inline | textOnCurve · else layout.maxWidth · else single-line (still honours \\n) |
Straight-line segments (renderEnhancedTextLine)
Defined in text-style.ts — ordering per documentation comment:
effects.highlight— backdropfillRecteffects.glow— blurredfillTexthalo (may double-fill when gradient glow)effects.shadow— Canvas shadowfillTextstroke—strokeText(complex styles multi-pass)fill—renderTextFill(colour / gradient)decorations— underline / overline / strikethrough horizontal rules (renderTextDecorations)
Arc glyphs (renderRotatedGlyph)
Each grapheme paints inside translate → rotate local space with textAlign: center, textBaseline: middle:
highlight → glow → shadow → stroke → fill → decorations (local variants: renderTextHighlightLocal, renderTextDecorationsLocal).
Multi-pass helpers worth knowing
| Helper | Role |
|---|---|
renderComplexTextStroke | Implements groove, ridge, double outline styles via stacked strokeText passes |
createTextGradient | Builds linear, radial, conic paints + optional repeating patterns |
Legacy module (draw-text-legacy.ts)
Older drawText helpers targeting TextObject remain for backwards compatibility — new code should call createText / measureText only.
Extending rendering
There is no alternate textPathRenderer wired into TextCreator today — arbitrary Bézier baselines require custom drawing or upstream preprocessing.