🔤
Fontkit
GithubTypogram
  • Welcome
  • Quick Start
  • Reference
    • API Reference Index
    • Fontkit Object
    • Font Object
    • GlyphRun Object
    • Glyph Object
    • Path Object
    • Subset Object
Powered by GitBook
On this page
  • Properties:
  • glyph.id:
  • glyph.path:
  • glyph.name:
  • glyph.type:
  • glyph.codePoints:
  • glyph.advanceWidth:
  • glyph.advanceHeight:
  • glyph.bbox:
  • glyph.cbox:
  • glyph.isMark:
  • glyph.isLigature:
  • glyph.ligatureCaretPositions:
  • glyph._font:
  • glyph._metrics:
  • Methods:
  • glyph._getPath():
  • glyph._getMetrics():
  • glyph._getContours():
  • glyph._getCBox():
  • glyph._getPhantomPoints(glyph):
  • glyph._parseGlyphCoord(stream, prev, short, same):
  • glyph._decode():
  • glyph._decodeSimple(glyph, stream):
  • glyph._decodeComposite(glyph, stream, offset = 0):
  • Render a Glyph's Path to SVG:

Was this helpful?

Edit on GitHub
  1. Reference

Glyph Object

PreviousGlyphRun ObjectNextPath Object

Last updated 1 year ago

Was this helpful?

This documentation for is created and provided by the team. It’s a third-party documentation intended to delve deeper into the fontkit API. For the most accurate information, refer to .

The Glyph object in Fontkit represents an individual glyph in the font, which corresponds to a specific visual representation of one or more characters.

Properties:

glyph.id:

  • Description: A unique identifier for the glyph within its font.

  • Type: Number

glyph.path:

  • Description: The path object for the glyph, representing the glyph's outlines and can be rendered or used for various operations.

  • Type: Path object

glyph.name:

  • Description: The name of the glyph, which can be a standard glyph name or a custom one defined by the font creator.

  • Type: String

glyph.type:

  • Description: The type of glyph, such as 'simple' or 'composite'.

  • Type: String

glyph.codePoints:

  • Description: An array of Unicode code points that the glyph represents. This can be more than one for ligatures and other combined forms.

  • Type: Array of Numbers

glyph.advanceWidth:

  • Description: The advance width of the glyph, representing the space the glyph occupies horizontally.

  • Type: Number

glyph.advanceHeight:

  • Description: The advance height of the glyph, representing the vertical space the glyph occupies. Relevant for vertical text layouts.

  • Type: Number

glyph.bbox:

  • Description: The bounding box of the glyph, encompassing the entire glyph and providing minX, minY, maxX, and maxY properties.

  • Type: Object

glyph.cbox:

  • Description: The control bounding box of the glyph, which encompasses all control points of the glyph's path. Useful for some precise layout operations.

  • Type: Object

glyph.isMark:

  • Description: Indicates if the glyph is a mark glyph, which is used for combining characters in many scripts.

  • Type: Boolean

glyph.isLigature:

  • Description: Indicates if the glyph is a ligature, representing multiple characters combined into a single glyph.

  • Type: Boolean

glyph.ligatureCaretPositions:

  • Description: An array indicating positions within the glyph where carets should be drawn when the glyph is selected. Relevant for ligatures where multiple characters combine into a single glyph.

  • Type: Array of Numbers

glyph._font:

  • Description: (Internal) Reference to the font object the glyph belongs to.

  • Type: Font object

glyph._metrics:

  • Description: (Internal) Metrics data for the glyph. Typically used internally by Fontkit.

  • Type: Object

Methods:

glyph._getPath():

  • Description: (Internal) Retrieves the path data for the glyph, which can be used for rendering or other operations.

  • Returns: A Path object representing the glyph's outlines.

glyph._getMetrics():

  • Description: (Internal) Retrieves the metrics for the glyph, which define its layout characteristics.

  • Returns: Metrics data.

glyph._getContours():

  • Description: (Internal) Retrieves the contours of the glyph, which define the glyph's shape.

  • Returns: An array of contours.

glyph._getCBox():

  • Description: (Internal) Retrieves the control bounding box of the glyph. This box encompasses all control points of the glyph's path.

  • Returns: Object

glyph._getPhantomPoints(glyph):

  • Description: (Internal) Retrieves the phantom points for the glyph, which are often used for hinting and layout purposes.

  • Returns: An array of phantom points.

glyph._parseGlyphCoord(stream, prev, short, same):

  • Description: (Internal) Parses specific coordinates from the glyph data, often used in the decoding process.

  • Parameters: Typically involves parameters related to font data or encoding specifics.

  • Returns: Parsed coordinates (usually Numbers or Objects).

glyph._decode():

  • Description: (Internal) Decodes the glyph data, which can be either simple or composite, depending on the glyph type.

  • Parameters: Typically data or stream references from the font file.

  • Returns: Decoded glyph data.

glyph._decodeSimple(glyph, stream):

  • Description: (Internal) Decodes the data for a simple glyph type.

  • Parameters: Typically data or stream references from the font file.

  • Returns: Decoded simple glyph data.

glyph._decodeComposite(glyph, stream, offset = 0):

  • Description: (Internal) Decodes the data for a composite glyph type.

  • Parameters: Typically data or stream references from the font file.

  • Returns: Decoded composite glyph data.

Render a Glyph's Path to SVG:

// Get a glyph for a specific code point (e.g., Unicode for "A")
const glyph = font.glyphForCodePoint(65);

// Convert the glyph's path to SVG
const svgPathData = glyph.path.toSVG();

console.log(`SVG Path Data for "A": ${svgPathData}`);
fontkit
Typogram
fontkit’s official documentation