Type Alias SvgHelper

SvgHelper: {
    height: number;
    get parent(): SVGElement;
    width: number;
    circle(circle: CirclePositioned, opts?: CircleDrawingOpts, queryOrExisting?: string | SVGCircleElement): SVGCircleElement;
    clear(): void;
    grid(center: Point, spacing: number, width: number, height: number, opts?: LineDrawingOpts): SVGGElement;
    line(line: Line, opts?: LineDrawingOpts, queryOrExisting?: string | SVGLineElement): SVGLineElement;
    path(svgString: string | readonly string[], opts?: PathDrawingOpts, queryOrExisting?: string | SVGPathElement): SVGPathElement;
    query<V>(selectors: string): null | V;
    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;
}

Helper to make SVG elements with a common parent.

Create with makeHelper.

Type declaration

  • get height(): number

    Gets/sets the height of the parent

  • set height(height: number): void
  • get parent(): SVGElement

    Gets the parent

  • get width(): number

    Gets/sets the width of the parent

  • set width(width: number): void
  • circle:function
    • circle(circle, opts?, queryOrExisting?): SVGCircleElement

    • Creates a circle

      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:function
    • clear(): void

    • Deletes all child elements

      Returns void

  • grid:function
    • grid(center, spacing, width, height, opts?): SVGGElement

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

      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

  • line:function
    • line(line, opts?, queryOrExisting?): SVGLineElement

    • Creates a line

      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:function
    • path(svgString, opts?, queryOrExisting?): SVGPathElement

    • Creates a path

      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:function
    • query<V>(selectors): null | V

    • Returns an element if it exists in parent

      Type Parameters

      • V extends SVGElement

      Parameters

      • selectors: string

        Eg #path

      Returns null | V

  • remove:function
    • remove(queryOrExisting): void

    • Parameters

      • queryOrExisting: string | SVGElement

      Returns void

  • text:function
    • text(text, pos, opts?, queryOrExisting?): SVGTextElement

    • Creates a text element

      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:function
    • textPath(pathReference, text, opts?, textQueryOrExisting?, pathQueryOrExisting?): SVGTextPathElement

    • Creates text on a path

      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