Options
All
  • Public
  • Public/Protected
  • All
Menu

Class VisualForm

VisualForm is an abstract class that represents a form that can be used to express Pts visually. For example, CanvasForm is an implementation of VisualForm that draws on CanvasSpace which represents a html canvas.

Hierarchy

Index

Properties

Protected _filled

_filled: boolean = true

Protected _font

_font: Font = new Font( 14, "sans-serif")

Protected _ready

_ready: boolean = false

Protected _stroked

_stroked: boolean = true

Accessors

currentFont

  • get currentFont(): Font

filled

  • get filled(): boolean
  • set filled(b: boolean): void

ready

  • get ready(): boolean
  • get whether the Form has received the Space's rendering context

    Returns boolean

stroked

  • get stroked(): boolean
  • set stroked(b: boolean): void

Methods

Protected _multiple

  • _multiple(groups: GroupLike[], shape: string, ...rest: any[]): this
  • Parameters

    • groups: GroupLike[]
    • shape: string
    • Rest ...rest: any[]

    Returns this

arc

  • arc(pt: PtLike, radius: number, startAngle: number, endAngle: number, cc?: boolean): this
  • Abstract arc drawing

    Parameters

    • pt: PtLike

      center position

    • radius: number

      radius of the arc circle

    • startAngle: number

      start angle of the arc

    • endAngle: number

      end angle of the arc

    • Optional cc: boolean

      an optional boolean value to specify if it should be drawn clockwise (false) or counter-clockwise (true). Default is clockwise.

    Returns this

circle

  • Abstract circle drawing

    see

    Circle.fromCenter

    Parameters

    • pts: GroupLike | number[][]

      usually a Group of 2 Pts, but it can also take an array of two numeric arrays [ [position], [size] ]

    Returns this

circles

  • Draw multiple circles at once

    Parameters

    • groups: GroupLike[]

      an array of Groups that defines multiple circles

    Returns this

fill

  • fill(c: string | boolean): this
  • Set fill color (not implemented)

    Parameters

    • c: string | boolean

    Returns this

fillOnly

  • fillOnly(c: string | boolean): this
  • Set current fill style and without stroke.

    example

    form.fillOnly("#F90"), form.fillOnly("rgba(0,0,0,.5")

    Parameters

    • c: string | boolean

      fill color which can be as color, gradient, or pattern. (See canvas documentation)

    Returns this

font

  • font(sizeOrFont: number | Font, weight?: string, style?: string, lineHeight?: number, family?: string): this
  • Abstract font setting

    see

    Font class

    example

    form.font( myFont ), form.font(14, "bold")

    Parameters

    • sizeOrFont: number | Font

      either a number to specify font-size, or a Font object to specify all font properties

    • Optional weight: string

      Optional font-weight string such as "bold"

    • Optional style: string

      Optional font-style string such as "italic"

    • Optional lineHeight: number

      Optional line-height number suchas 1.5

    • Optional family: string

      Optional font-family such as "Helvetica, sans-serif"

    Returns this

line

  • Abstract a line or polyline drawing

    Parameters

    • pts: GroupLike | number[][]

      a Group of multiple Pts, or an array of multiple numeric arrays

    Returns this

lines

  • Draw multiple lines at once

    Parameters

    • groups: GroupLike[]

      An array of Groups of Pts

    Returns this

point

  • point(p: PtLike, radius: number, shape: string): this
  • Abstract point drawing

    example

    form.point( p ), form.point( p, 10, "circle" )

    Parameters

    • p: PtLike

      a Pt object

    • radius: number

      radius of the point. Default is 5.

    • shape: string

      The shape of the point. Defaults to "square", but it can be "circle" or a custom shape function in your own implementation.

    Returns this

points

  • points(pts: GroupLike | number[][], radius: number, shape: string): this
  • Draw multiple points at once

    Parameters

    • pts: GroupLike | number[][]

      an array of Pt or an array of number arrays

    • radius: number

      radius of the point. Default is 5.

    • shape: string

      The shape of the point. Defaults to "square", but it can be "circle" or a custom shape function in your own implementation.

    Returns this

polygon

  • Abstract polygon drawing

    Parameters

    • pts: GroupLike | number[][]

      a Group of multiple Pts, or an array of multiple numeric arrays

    Returns this

polygons

  • Draw multiple polygons at once

    Parameters

    • groups: GroupLike[]

      An array of Groups of Pts

    Returns this

rect

  • rect(pts: number[][] | Pt[]): this
  • Abstract rectangle drawing

    Parameters

    • pts: number[][] | Pt[]

      usually a Group of 2 Pts specifying the top-left and bottom-right positions. Alternatively it can be an array of numeric arrays.

    Returns this

rects

  • Draw multiple rectangles at once

    Parameters

    • groups: GroupLike[]

      An array of Groups of Pts

    Returns this

reset

  • reset(): this
  • Abstract reset style

    Returns this

squares

  • Draw multiple squares at once

    Parameters

    • groups: GroupLike[]

      an array of Groups that defines multiple circles

    Returns this

stroke

  • stroke(c: string | boolean, width?: number, linejoin?: string, linecap?: string): this
  • Set stroke style (not implemented)

    Parameters

    • c: string | boolean
    • Optional width: number
    • Optional linejoin: string
    • Optional linecap: string

    Returns this

strokeOnly

  • strokeOnly(c: string | boolean, width?: number, linejoin?: string, linecap?: string): this
  • Set current stroke style and without fill.

    example

    form.strokeOnly("#F90"), form.strokeOnly("#000", 0.5, 'round', 'square')

    Parameters

    • c: string | boolean

      stroke color which can be as color, gradient, or pattern. (See canvas documentation

    • Optional width: number
    • Optional linejoin: string
    • Optional linecap: string

    Returns this

text

  • text(pt: PtLike, txt: string, maxWidth?: number): this
  • Abstract text rendering

    Parameters

    • pt: PtLike
    • txt: string
    • Optional maxWidth: number

    Returns this

Static _checkSize

  • _checkSize(pts: GroupLike | number[][], required?: number): boolean
  • Check number of items in a Group against a required number

    Parameters

    • pts: GroupLike | number[][]
    • Default value required: number = 2

    Returns boolean

Generated using TypeDoc