Types · API · blotter.ts

TextProperties interface

The styles a Text is drawn with. Every field is optional on construction.

interface TextProperties {

family : string ;

size : number ;

leading : string | number ;

fill : string ;

style : string ;

weight : string | number ;

padding : number ;

paddingTop : number ;

paddingRight : number ;

paddingBottom : number ;

paddingLeft : number ;

}

family: Any CSS font-family list. Default "sans-serif".
size: Font size in pixels. Default 12.
leading: Line height as a unitless multiplier, or a string in px or %. Default 1.5; keep it above 1.
fill: Text colour. Default "#000".
style: "normal" or "italic". Default "normal".
weight: A number or string, as in CSS. Default 400.
padding: Space around the text in pixels, on every side. Default 0.
paddingTop: Per-side override.
paddingRight: Per-side override.
paddingBottom: Per-side override.
paddingLeft: Per-side override.

TextEvents type

The events a Text emits: update, whenever its value or properties change.

type TextEvents = {

update : [] ;

}

TextBounds interface

A rectangle in the atlas: x, y, width and height in pixels.

interface TextBounds {

x : number ;

y : number ;

w : number ;

h : number ;

}

RenderScopeEvents type

The events a RenderScope emits: ready, update and render for this text, plus the pointer events with a normalised position.

type RenderScopeEvents = {

ready : [] ;

update : [] ;

render : [frameCount: number] ;

update:uniform : [uniformName: string] ;

mousedown : [position: MousePosition] ;

mouseup : [position: MousePosition] ;

mousemove : [position: MousePosition] ;

mouseenter : [position: MousePosition] ;

mouseleave : [position: MousePosition] ;

}

BlotterEvents type

The events a Blotter emits: ready after the first build, update after later rebuilds, render every frame with the frame count.

type BlotterEvents = {

ready : [] ;

update : [] ;

render : [] ;

}

BlotterOptions interface

Options for the Blotter constructor.

interface BlotterOptions {

texts ?: Text | Text[] ;

ratio ?: number ;

autobuild ?: boolean ;

autostart ?: boolean ;

autoplay ?: boolean ;

}

texts: A text or an array of texts to draw.
ratio: Pixel ratio for every output canvas. Default: the device pixel ratio.
autobuild: Build on construction and after changes. Default true.
autostart: Start the render loop immediately. Default true.
autoplay: New render scopes start playing. Default true.

UniformType type

The four GLSL vector sizes a uniform can have.

type UniformType = "1f" | "2f" | "3f" | "4f"

Vec2 type

A two-number tuple.

type Vec2 = [number, number]

Vec3 type

A three-number tuple.

type Vec3 = [number, number, number]

Vec4 type

A four-number tuple.

type Vec4 = [number, number, number, number]

UniformValueMap interface

The value shape for each UniformType: a number for "1f", a tuple otherwise.

interface UniformValueMap {

1f : number ;

2f : Vec2 ;

3f : Vec3 ;

4f : Vec4 ;

}

UniformDescriptor type

What you write when declaring a uniform: a type and a matching initial value.

type UniformDescriptor =
  | { type: "1f"; value: number }
  | { type: "2f"; value: Vec2 }
  | { type: "3f"; value: Vec3 }
  | { type: "4f"; value: Vec4 }