LittleJS 1.28.0

Draw

ImageFont

Image Font Object - Draw text by using tiles in an image

  • 96 characters (from space to tilde) are stored in an image
  • A 8x8 default engine font is supplied for general use
  • This system is WebGL enabled for fast text rendering
  • Fonts can also be colored and scaled along each axis

Constructor

new ImageFont(tileInfo)engineDraw.js:1958

Create an image font

tileInfo TileInfo

Tile info of first character in font

// use built in font
const font = engineImageFont;

// draw text
font.drawTextScreen('LittleJS\nHello World!', vec2(200, 50), 16);

Members

Methods

Members

tileInfo : TileInfoengineDraw.js:1968

Tile info for the font

Methods

drawText(text, pos, size, center, color, useWebGL, context)engineDraw.js:1981

Draw text in world space using the image font

  • The text stays upright and ignores cameraAngle, each glyph is snapped to whole screen pixels to keep it crisp
text string|number
pos Vector2
size Vector2|number optional, default 1
center boolean optional, default true

center each line on pos, and the lines of multi-line text around it

color Color optional, default WHITE
useWebGL boolean optional, default glEnable
context CanvasRenderingContext2D|OffscreenCanvasRenderingContext2D optional
drawTextScreen(text, pos, size, center, color, useWebGL, context)engineDraw.js:2010

Draw text in screen space using the image font

text string|number
pos Vector2
size Vector2|number
center boolean optional, default true

center each line on pos, and the lines of multi-line text around it

color Color optional, default WHITE
useWebGL boolean optional, default glEnable
context CanvasRenderingContext2D|OffscreenCanvasRenderingContext2D optional
getGlyphPos(index, pos) → Vector2engineDraw.js:2057

Get where a glyph sits in the texture: counted in the font's own columns when its tile has them, like a font packed by loadSprite, otherwise along the texture's grid from the font's first tile, the way tile() lays it out

index number

Glyph number, 0 is the space and the characters follow in ASCII order

pos Vector2 optional

Written into and returned, for a loop that places many