Options
All
  • Public
  • Public/Protected
  • All
Menu

SDF-2D - v0.5.2

Index

Enumerations

Drawable Classes

Other Classes

Interfaces

Type aliases

Color Functions

Drawable Functions

Other Functions

Object literals

Type aliases

TextureWithOptions

TextureWithOptions: { overrides: Partial<TextureOptions>; source: TexImageSource }

Type declaration

Color Functions

Const hex

  • hex(hex: string): vec3

Const hsl

  • hsl(hue: number, saturation: number, lightness: number): vec3

Const rgb

  • rgb(r: number, g: number, b: number): vec3

  • Return a color contained in a vec3.

    Parameters

    • r: number

      Should be between 0 and 1

    • g: number

      Should be between 0 and 1

    • b: number

      Should be between 0 and 1

    Returns vec3

Const rgb255

  • rgb255(r: number, g: number, b: number): vec3

  • Return a color contained in a vec3.

    Parameters

    • r: number

      Should be between 0 and 255

    • g: number

      Should be between 0 and 255

    • b: number

      Should be between 0 and 255

    Returns vec3

Const rgba

  • rgba(r: number, g: number, b: number, a: number): vec4

  • Return a color with transparency contained in a vec4.

    Parameters

    • r: number

      Should be between 0 and 1

    • g: number

      Should be between 0 and 1

    • b: number

      Should be between 0 and 1

    • a: number

      Should be between 0 and 1

    Returns vec4

Const rgba255

  • rgba255(r: number, g: number, b: number, a: number): vec4

  • Return a color with transparency contained in a vec4.

    Parameters

    • r: number

      Should be between 0 and 255

    • g: number

      Should be between 0 and 255

    • b: number

      Should be between 0 and 255

    • a: number

      Should be between 0 and 255

    Returns vec4

Drawable Functions

Const CircleFactory

  • CircleFactory(color: vec3 | vec4 | number): typeof CircleBase

Const DropletFactory

  • DropletFactory(color: vec3 | vec4 | number): typeof DropletBase

Const InvertedTunnelFactory

Const MetaCircleFactory

  • MetaCircleFactory(color: vec3 | vec4 | number): typeof MetaCircleBase

Const NoisyPolygonFactory

  • NoisyPolygonFactory(vertexCount: number, colorIndex: number): typeof PolygonBase & NoisyPolygonBase

Const PolygonFactory

  • PolygonFactory(vertexCount: number, colorIndex: number): typeof PolygonBase

Const RotatedRectangleFactory

Other Functions

compile

  • Compiles a new renderer instance. There can multiple renderers on a single page.

    Asynchronous behaviour is required for parallel shader compiling. Trying to draw before the returned promise resolves, results in no action taken. Settings can be set before promise resolution and they will be applied later.

    The descriptors of every to-be-drawn objects are required before creating the renderer, allowing the compiler to only create the shaders that will actually be used.

    Example usage:

     import { compile, hsl, CircleFactory, CircleLight } from 'sdf-2d';

 const canvas = document.querySelector('canvas');
 const Circle = CircleFactory(hsl(30, 66, 50));
 const renderer = await compile(canvas, [Circle.descriptor, CircleLight.descriptor]);

    Parameters

    • canvas: HTMLCanvasElement

      The returned renderer will only be able to draw to this canvas.

    • descriptors: Array<DrawableDescriptor>

      The descriptor of every single object (and light) that ever needs to be drawn by this renderer has to be given before compiling.

    • Default value settingsOverrides: Partial<StartupSettings> = {}

      Sensible defaults are provided, but these can be overridden.

    Returns Promise<Renderer>

Const renderNoise

  • renderNoise(textureSize: vec2, scale: number, amplitude: number, ignoreWebGL2?: boolean): Promise<HTMLCanvasElement>

  • Create a renderer, draw a 2D noise texture with it, then destroy the used resources, while returning the generated texture in the form of a canvas.

    Parameters

    • textureSize: vec2

      The resolution of the end result.

    • scale: number

      A starting value can be 15

    • amplitude: number

      A starting value can be 1

    • Default value ignoreWebGL2: boolean = false

      Ignore WebGL2, even when its available.

    Returns Promise<HTMLCanvasElement>

Object literals

Const defaultRuntimeSettings

defaultRuntimeSettings: object

Contains the default values used for RuntimeSettings.

ambientLight

ambientLight: vec3 = vec3.fromValues(0.25, 0.15, 0.25)

colorPalette

colorPalette: never[] = []

enableHighDpiRendering

enableHighDpiRendering: false = false

isWorldInverted

isWorldInverted: false = false

lightCutoffDistance

lightCutoffDistance: number = 400

textures

textures: {}

Type declaration

tileMultiplier

tileMultiplier: number = 8

Const defaultStartupSettings

defaultStartupSettings: object

Contains the default values used for StartupSettings.

backgroundColor

backgroundColor: vec4 = vec4.fromValues(1, 1, 1, 1)

enableStopwatch

enableStopwatch: false = false

ignoreWebGL2

ignoreWebGL2: false = false

paletteSize

paletteSize: number = 256

shadowTraceCount

shadowTraceCount: number = 16