ixfx
    Preparing search index...

    Type Alias SvgHelper

    Helper to make SVG elements with a common parent.

    Create with makeHelper.

    type SvgHelper = {
        circle: (
            circle: CirclePositioned,
            opts?: CircleDrawingOpts,
            queryOrExisting?: string | SVGCircleElement,
        ) => SVGCircleElement;
        clear: () => void;
        grid: (
            center: Point,
            spacing: number,
            width: number,
            height: number,
            opts?: LineDrawingOpts,
        ) => SVGGElement;
        group: (
            children: readonly SVGElement[],
            queryOrExisting?: string | SVGGElement,
        ) => SVGGElement;
        line: (
            line: Line,
            opts?: LineDrawingOpts,
            queryOrExisting?: string | SVGLineElement,
        ) => SVGLineElement;
        path: (
            svgString: string | readonly string[],
            opts?: PathDrawingOpts,
            queryOrExisting?: string | SVGPathElement,
        ) => SVGPathElement;
        query: <V extends SVGElement>(selectors: string) => V | null;
        remove: (queryOrExisting: string | SVGElement) => void;
        text: (
            text: string,
            pos: Point,
            opts?: TextDrawingOpts,
            queryOrExisting?: string | SVGTextElement,
        ) => SVGTextElement;
        textPath: (
            pathReference: string,
            text: string,
            opts?: TextDrawingOpts,
            textQueryOrExisting?: string | SVGTextElement,
            pathQueryOrExisting?: string | SVGTextPathElement,
        ) => SVGTextPathElement;
        get height(): number;
        set height(height: number): void;
        get parent(): SVGElement;
        get width(): number;
        set width(width: number): void;
    }
    Index

    Accessors

    height parent width

    Properties

    circle clear grid group line path query remove text textPath

    Accessors

    Properties

    circle: (
        circle: CirclePositioned,
        opts?: CircleDrawingOpts,
        queryOrExisting?: string | SVGCircleElement,
    ) => SVGCircleElement

    Creates a circle

    Type Declaration

      • (
            circle: CirclePositioned,
            opts?: CircleDrawingOpts,
            queryOrExisting?: string | SVGCircleElement,
        ): SVGCircleElement

      • Parameters

        • circle: CirclePositioned

          Circle

        • Optionalopts: CircleDrawingOpts

          Drawing options

        • OptionalqueryOrExisting: string | SVGCircleElement

          DOM query to look up existing element, or the element instance

        Returns SVGCircleElement

    clear: () => void

    Deletes all child elements

    grid: (
        center: Point,
        spacing: number,
        width: number,
        height: number,
        opts?: LineDrawingOpts,
    ) => SVGGElement

    Creates a grid of horizontal and vertical lines inside of a group

    Type Declaration

      • (
            center: Point,
            spacing: number,
            width: number,
            height: number,
            opts?: LineDrawingOpts,
        ): SVGGElement

      • Parameters

        • center: Point

          Grid origin

        • spacing: number

          Cell size

        • width: number

          Width of grid

        • height: number

          Height of grid

        • Optionalopts: LineDrawingOpts

          Drawing options

        Returns SVGGElement

    group: (
        children: readonly SVGElement[],
        queryOrExisting?: string | SVGGElement,
    ) => SVGGElement
    line: (
        line: Line,
        opts?: LineDrawingOpts,
        queryOrExisting?: string | SVGLineElement,
    ) => SVGLineElement

    Creates a line

    Type Declaration

      • (
            line: Line,
            opts?: LineDrawingOpts,
            queryOrExisting?: string | SVGLineElement,
        ): SVGLineElement

      • Parameters

        • line: Line

          Line

        • Optionalopts: LineDrawingOpts

          Drawing options

        • OptionalqueryOrExisting: string | SVGLineElement

          DOM query to look up existing element, or the element instance

        Returns SVGLineElement

    path: (
        svgString: string | readonly string[],
        opts?: PathDrawingOpts,
        queryOrExisting?: string | SVGPathElement,
    ) => SVGPathElement

    Creates a path

    Type Declaration

      • (
            svgString: string | readonly string[],
            opts?: PathDrawingOpts,
            queryOrExisting?: string | SVGPathElement,
        ): SVGPathElement

      • Parameters

        • svgString: string | readonly string[]

          Path description, or empty string

        • Optionalopts: PathDrawingOpts

          Drawing options

        • OptionalqueryOrExisting: string | SVGPathElement

          DOM query to look up existing element, or the element instance

        Returns SVGPathElement

    query: <V extends SVGElement>(selectors: string) => V | null

    Returns an element if it exists in parent

    Type Declaration

      • <V extends SVGElement>(selectors: string): V | null

      • Type Parameters

        • V extends SVGElement

        Parameters

        • selectors: string

          Eg #path

        Returns V | null

    remove: (queryOrExisting: string | SVGElement) => void

    text

    text: (
        text: string,
        pos: Point,
        opts?: TextDrawingOpts,
        queryOrExisting?: string | SVGTextElement,
    ) => SVGTextElement

    Creates a text element

    Type Declaration

      • (
            text: string,
            pos: Point,
            opts?: TextDrawingOpts,
            queryOrExisting?: string | SVGTextElement,
        ): SVGTextElement

      • Parameters

        • text: string

          Text

        • pos: Point

          Position

        • Optionalopts: TextDrawingOpts

          Drawing options

        • OptionalqueryOrExisting: string | SVGTextElement

          DOM query to look up existing element, or the element instance

        Returns SVGTextElement

    textPath: (
        pathReference: string,
        text: string,
        opts?: TextDrawingOpts,
        textQueryOrExisting?: string | SVGTextElement,
        pathQueryOrExisting?: string | SVGTextPathElement,
    ) => SVGTextPathElement

    Creates text on a path

    Type Declaration

      • (
            pathReference: string,
            text: string,
            opts?: TextDrawingOpts,
            textQueryOrExisting?: string | SVGTextElement,
            pathQueryOrExisting?: string | SVGTextPathElement,
        ): SVGTextPathElement

      • Parameters

        • pathReference: string

          Reference to path element

        • text: string

          Text

        • Optionalopts: TextDrawingOpts

          Drawing options

        • OptionaltextQueryOrExisting: string | SVGTextElement

          DOM query to look up existing element, or the element instance

        • OptionalpathQueryOrExisting: string | SVGTextPathElement

          DOM query to look up existing element, or the element instance

        Returns SVGTextPathElement

    Settings

    Member Visibility

    On This Page

    Accessors
    Properties