C0d1ng4fun

Vector Glyphs

2025

Vector representation of glyphs enable scalable high resolution Scanline Rendering. Using up to three lines and three arcs with simple transformations all writable 8-bit UTF-8 glyphs are represented. The primitives and operation can easily be expressed as Signed Distance Functions (SDFs). Sampling the SDF provide the nearest distance to the glyph and a simple threshold can be used to control thickness.

For hardware implementation the SDF can be approximated without use of multipliers. Lines have a polar representation limited to a few angles. Arcs are limited to any sequence of full quadrants. X and Y can be mirrored or flipped around a point independently to reuse shapes. This representation is packed into 302 32-bit words which averages to 102-bits per glyph for the 95 writable 8-bit glyphs in UTF-8. As a comparison a 10x10 bit pattern would be 100-bits. In 1080p the recommended minimum glyph height is 24 pixels which results in around 4-bits per line of a glyph (or less) in a 1080p scanline setup.

SDFs can also be used for Constructive Solid Geometry. That way it is possible to add relief text to 3D models.

A general JSON representation of the glyphs is provided in a file below with following format:

• Output format is a JSON object where each glyph is a key to a Glyph object.
• A Glyph object represents a glyph in em coordinates with the origin being in the left tip of the baseline of the glyph. 'size' and 'offset' describe the size and position of a bounding box of the glyph shapes under the active transform. 'shapes' is an array of Shape objects who make up the glyph when combined.
• A Shape object represent either a point, line or an arc, under an optional transform. 'transform' is mapped to a Transform object that describe how the Glyph object coordinates can be transformed into Shape coordinates where the shape is defined. Then exactly one key of 'point', 'line' or 'arc' is mapped to a Point object, Line object or Arc object respectively.
• A Transform object can be a combination of flip or fold operations to the x and y axis separately. The keys are structured like '<operation><axis>' and maps to a number used to describe a 1D coordinate along the specified axis used by the transform. The flip operation flips the axis around the specific coordinate c such that the transformed coordinate u at original coordinate v is u = c - v. The fold operation folds the axis around the specific coordinate c such that the transformed coordinate u at original coordinate v is u = c - |v - c|.
• A Point object has a single key 'p' which is an array with an x and y coordinate of the point.
• A Line object has two keys, 'a' and 'b', which are arrays with x and y coordinate of the line start and end.
• An Arc object has a key 'c' which is an array with an x and y coordinate of the lower corner of a bounding box around a circle with the arc radius. 'r' maps to a number that is the radius of the arc. 'q0' maps to a number that is the first quadrant of the arc. 'qn' maps to a number that is the number of quadrants the arc cover, with 4 being a full circle.