figureone
    Preparing search index...

    Class FigureElement

    Figure Element base class

    The set of properties and methods shared by all figure elements

    A figure element has several color related properties. Color is defined as an RGBA array with values between 0 and 1. The alpha channel defines the transparency or opacity of the color where 1 is fully opaque and 0 is fully transparent.

    The color property stores the element's current color, while the defaultColor property stores the element's color when not dimmed or dissolving. Color should only be set using the setColor method.

    An element can be "dimmed" or "undimmed". For instance, a red element might turn grey when dimmed. The property dimColor stores the desired color to dim to and should be set with setDimColor()

    An element can be dissolved in or out with animation. Dissolving an element out transitions its opacity from its current value to 0. The opacity property is used when dissolving. The opacity is multiplied by the alpha channel of color to net a final opacity. Opacity should not be set directly as it will be overwritten by dissolve animations.

    Notifications - The notification manager property notifications will publish the following events:

    • beforeSetTransform: published just before the transform property is changed
    • setTransform: published whenever the transform property is changed
    • startBeingMoved: published when the element starts being moved by touch
    • stopBeingMoved: published when the element stops being moved by touch
    • startMovingFreely
    • stopMovingFreely
    • show: published when element is shown
    • hide: published when element is hidden
    • visibility: published when element element is shown or hidden
    • onClick: published when element is clicked on
    • color: published whenever color is set
    • beforeDraw
    • afterDraw
    • setState: state of element has been set

    Hierarchy (View Summary)

    Index

    Methods

    • Conveniently set the first translation of the element's transform.

      Parameters

      • pointOrX: number | TypeParsablePoint

        x coordinate or full point definition

      • y: number = 0

        y coordinate if pointOrX is just the x coordinate (0)

      • z: number = 0

      Returns void

    • Conveniently set the first scale of the element's transform.

      Parameters

      • scaleOrX: number | TypeParsablePoint

        horizontal scale - either define as full x-y point, or as a number. If scaleOrX is a number and y is null, then both x and y will be equally scaled

      • y: number | null = null

        y coordinate if scaleOrX is a number (null)

      • z: number = 1

      Returns void

    • Set transform of element. Setting through this method will ensure setTransfrom subscription will publish, and transform will be appropriately clipped.

      Parameters

      Returns void

    • Set element color.

      Parameters

      • color: TypeColor

        RGBA color from 0 to 1

      • OptionalsetDefault: boolean = true

        also set the default color to this color

      Returns void

    • Save the current transform, color and/or visibility to a scenario.

      Parameters

      • scenarioName: string
      • keys: string[] = ...

      Returns void

    • Pulse element.

      An element can be pulsed in scale, a rotation or a translation.

      The scale pulse can either be a single pulse, or a number of copies with a range of scales - which has the effect of making regular polygons thick.

      Either pass in a callback, or an options object defining the pulse and callback.

      Parameters

      • optionsOrDone: OBJ_Pulse | (() => void) | null = null

      Returns void

    • Transform a point between 'draw', 'local', 'figure', 'gl' and 'pixel' spaces.

      plane is only needed when converting from pixel space (a 2D space) to 'figure', 'local' or 'draw' spaces (a 3D space). A ray from the pixel is drawn into the screen and the intersection with the defined plane is returned.

      'pixel' to 'gl' is also a 2D to 3D transformation, but in this case the XY plane at z = 0 is used in gl space.

      Parameters

      • point: TypeParsablePoint
      • fromSpace: "figure" | "pixel" | "gl" | "local" | "draw"

        space to convert point from

      • toSpace: "figure" | "pixel" | "gl" | "local" | "draw"

        space to convert point to

      • toSpacePlane: TypeParsablePlane = ...

      Returns Point

    • Return the first rotation in the element's transform.

      Parameters

      • normalize: "" | "0to360" | "-180to180" = ''

        how to normalize the returned angle where '' returns the raw angle

      Returns number

      scale

    • Get position of element

      By default the first translation of the element's transform is returned. This is effectively the element's location in 'local' coordinates.

      The position of the element relative to its horizontal and vertical bounds can also be returned. Use xAlign to find the x coordinate of the left, center, right or percentage width from left of the element. Use yAlign to find the bottom, middle, top or percentage height from bottom of the element.

      Parameters

      • space: TypeCoordinateSpace = 'local'

        the space to return the position in

      • xAlign: number | "left" | "right" | "center" | "location" = 'location'

        horizontal alignment of position. Use a number to define the horizontal position in percentage width from the left.

      • yAlign: number | "top" | "bottom" | "middle" | "location" = 'location'

        vertical alignment of position. Use a number to define the vertical position in percentage height from the bottom.

      Returns Point

    • Align element position in local space such that it is in the same position as the target element (even if that element is in a different local space)

      Parameters

      Returns void

    • true set this element as touchable and configures all parent elements to accept touches for their children

      false makes this element not touchable.

      Parameters

      Returns void

    • Configure all parents to make this element touchable, and make this element touchable and movable

      Parameters

      • movable: boolean = true

        true to make movable, false to not

      Returns void