Options
All
  • Public
  • Public/Protected
  • All
Menu

Hierarchy

Index

Constructors

Properties

config: options
editUI: editUI
isVisible: boolean
menuUI: menuUI
nodeCircleMenuUI: circleMenuUI
nodeContextMenuUI: menuUI
nodeMenuUI: menuUI
nodes: {}

Type declaration

    searchUI: searchUI
    toolbarUI: toolbarUI
    HIDE_EDIT_FORM_ON_PAN: boolean

    Hides the Edit Form when the family is moved with pan

    LAZY_LOADING: boolean

    Can be used to instruct the browser to defer loading of FamilyTree that are off-screen until the user scrolls near them. The init event listener will be called as soon as the FamilyTree become visible.

    VERSION: string
    attr: any
    clinkTemplates: {}

    Type declaration

    elements: any
    events: { on: any }

    Type declaration

    • on:function
      • on(type: "node-created" | "layout", listener: (args: any, args1: any, args2: any) => void): void
      • node-created and layout event listeners are obsolete use node-initialized or node-layout instead

        Parameters

        • type: "node-created" | "layout"
        • listener: (args: any, args1: any, args2: any) => void
            • (args: any, args1: any, args2: any): void
            • Parameters

              • args: any
              • args1: any
              • args2: any

              Returns void

        Returns void

    expcollOpenTag: any
    grCloseTag: any
    icon: { add: any; addUser: any; close: any; csv: any; details: any; edit: any; excel: any; ft: any; happy: any; link: any; pdf: any; png: any; remove: any; sad: any; share: any; svg: any; user: any; xml: any }

    Type declaration

    • add:function
      • add(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • addUser:function
      • addUser(w: string | number, h: string | number, c: string | number, x?: string | number, y?: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number
        • Optional x: string | number
        • Optional y: string | number

        Returns string

    • close:function
      • close(w: string | number, h: string | number, c: string | number, x?: string | number, y?: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number
        • Optional x: string | number
        • Optional y: string | number

        Returns string

    • csv:function
      • csv(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • details:function
      • details(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • edit:function
      • edit(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • excel:function
      • excel(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • ft:function
      • ft(w: string | number, h: string | number, c: string | number, x?: string | number, y?: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number
        • Optional x: string | number
        • Optional y: string | number

        Returns string

    • happy:function
      • happy(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • link:function
      • link(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • pdf:function
      • pdf(w: string | number, h: string | number, c: string): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string

        Returns string

    • png:function
      • png(w: string | number, h: string | number, c: string): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string

        Returns string

    • remove:function
      • remove(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • sad:function
      • sad(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • share:function
      • share(w: string | number, h: string | number, c: string | number, x?: string | number, y?: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number
        • Optional x: string | number
        • Optional y: string | number

        Returns string

    • svg:function
      • svg(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    • user:function
      • user(w: string | number, h: string | number, c: string | number, x?: string | number, y?: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number
        • Optional x: string | number
        • Optional y: string | number

        Returns string

    • xml:function
      • xml(w: string | number, h: string | number, c: string | number): string
      • Parameters

        • w: string | number
        • h: string | number
        • c: string | number

        Returns string

    loading: { hide: any; show: any }

    Shows/hides lloading image. Usefull when export large data to pdf. You can override and show your own loading image.

    Type declaration

    scroll: { chrome?: { smooth?: number; speed?: number }; edge?: { smooth?: number; speed?: number }; firefox?: { smooth?: number; speed?: number }; opera?: { smooth?: number; speed?: number }; safari?: { smooth?: number; speed?: number }; smooth?: number; speed?: number; visible?: boolean }

    Type declaration

    • Optional chrome?: { smooth?: number; speed?: number }
      • Optional smooth?: number
      • Optional speed?: number
    • Optional edge?: { smooth?: number; speed?: number }
      • Optional smooth?: number
      • Optional speed?: number
    • Optional firefox?: { smooth?: number; speed?: number }
      • Optional smooth?: number
      • Optional speed?: number
    • Optional opera?: { smooth?: number; speed?: number }
      • Optional smooth?: number
      • Optional speed?: number
    • Optional safari?: { smooth?: number; speed?: number }
      • Optional smooth?: number
      • Optional speed?: number
    • Optional smooth?: number
    • Optional speed?: number
    • Optional visible?: boolean
    slinkTemplates: {}

    Type declaration

    state: { clear: any }

    Type declaration

    • clear:function
      • clear(stateName: string): void
      • Parameters

        • stateName: string

        Returns void

    templates: {}

    Type declaration

    Event Listeners Methods

    • on(type: "init" | "add" | "node-tree-menu-show" | "field" | "update" | "renderbuttons" | "label" | "render-link" | "redraw" | "expcollclick" | "exportstart" | "exportend" | "click" | "dbclick" | "slink-click" | "clink-click" | "up-click" | "import" | "adding" | "added" | "updated" | "key-down" | "visibility-change" | "renderdefs" | "render" | "prerender" | "screen-reader-text" | "removed" | "ready" | "ripple" | "node-initialized" | "node-layout", listener: (sender: FamilyTree, args?: any, args1?: any, args2?: any) => boolean | void): FamilyTree
    • The on() method of the OrgChart class sets up a function that will be called whenever the specified event is delivered to the target. *

      Parameters

      • type: "init" | "add" | "node-tree-menu-show" | "field" | "update" | "renderbuttons" | "label" | "render-link" | "redraw" | "expcollclick" | "exportstart" | "exportend" | "click" | "dbclick" | "slink-click" | "clink-click" | "up-click" | "import" | "adding" | "added" | "updated" | "key-down" | "visibility-change" | "renderdefs" | "render" | "prerender" | "screen-reader-text" | "removed" | "ready" | "ripple" | "node-initialized" | "node-layout"

        A case-sensitive string representing the event type to listen for.

      • listener: (sender: FamilyTree, args?: any, args1?: any, args2?: any) => boolean | void

        The object that receives a notification when an event of the specified type occurs. This must be a JavaScript function.

          • (sender: FamilyTree, args?: any, args1?: any, args2?: any): boolean | void
          • Parameters

            • sender: FamilyTree
            • Optional args: any
            • Optional args1: any
            • Optional args2: any

            Returns boolean | void

      Returns FamilyTree

    • onExpandCollpaseButtonClick(listener: (args: { collapsing: boolean; id: string | number; ids: (string | number)[] }) => void): FamilyTree
    • The onExpandCollpaseButtonClick event occurs when the family is redrawed.

      var family = new FamilyTree('#tree', {});
      family.onExpandCollpaseButtonClick(() => {
      //return false; to cancel the operation
      });
      family.load(nodes);

      Parameters

      • listener: (args: { collapsing: boolean; id: string | number; ids: (string | number)[] }) => void
          • (args: { collapsing: boolean; id: string | number; ids: (string | number)[] }): void
          • Parameters

            • args: { collapsing: boolean; id: string | number; ids: (string | number)[] }
              • collapsing: boolean

                Indicates id the operation is collaps or expand

              • id: string | number

                the id of the clicked node

              • ids: (string | number)[]

                node ids that will be expanded or collapsed

            Returns void

      Returns FamilyTree

    • onExportEnd(listener: (args: { ArrayBuffer: ArrayBuffer; content: string; ext: string; filename: string; nodes: object[]; options: exportOptions; styles: string }) => void): FamilyTree
    • Occurs in the beginning of the export. Use this event listener to hide loading image or upload exported document to your server using ArrayBuffer argument.

      var family = new FamilyTree('#tree', {});
      family.onExportEnd(() => {
      //return false; to cancel the operation for example id you prefer the exported document to not download
      });
      family.load(nodes);

      Parameters

      • listener: (args: { ArrayBuffer: ArrayBuffer; content: string; ext: string; filename: string; nodes: object[]; options: exportOptions; styles: string }) => void
          • (args: { ArrayBuffer: ArrayBuffer; content: string; ext: string; filename: string; nodes: object[]; options: exportOptions; styles: string }): void
          • Parameters

            • args: { ArrayBuffer: ArrayBuffer; content: string; ext: string; filename: string; nodes: object[]; options: exportOptions; styles: string }
              • ArrayBuffer: ArrayBuffer

                the array buffer is the exported document, you can save it on a server or send it via email

                this property is initialized only for PDF/PNG exports

              • content: string

                csv ot xml string

                this property is initialized only for CSV/XML/SVG exports

              • ext: string

                extension

                this property is initialized only for CSV/XML exports

              • filename: string

                filename, you can change the filename here

                this property is initialized only for CSV/XML exports

              • nodes: object[]

                an array of node objects

                this property is initialized only for CSV/XML exports

              • options: exportOptions

                export options

                this property is initialized only for SVG exports

              • styles: string

                add extra styles

                this property is initialized only for SVG exports

            Returns void

      Returns FamilyTree

    • onExportStart(listener: (args: { content: string; ext: string; filename: string; nodes: object[]; options: exportOptions; pages: any; styles: string }) => void): FamilyTree
    • Occurs in the beginning of the export. Extra css styles can be added to the exported document using this event listener or show loading image.

      var family = new FamilyTree('#tree', {});
      family.onExportStart(() => {
      args.styles += '<link href="https://fonts.googleapis.com/css?family=Gochi+Hand" rel="stylesheet">';
      //return false; to cancel the operation
      });
      family.load(nodes);

      Parameters

      • listener: (args: { content: string; ext: string; filename: string; nodes: object[]; options: exportOptions; pages: any; styles: string }) => void
          • (args: { content: string; ext: string; filename: string; nodes: object[]; options: exportOptions; pages: any; styles: string }): void
          • Parameters

            • args: { content: string; ext: string; filename: string; nodes: object[]; options: exportOptions; pages: any; styles: string }
              • content: string

                the content to be exported

                this property is initialized only for PDF/PNG/SVG exports

              • ext: string

                extension

                this property is initialized only for CSV/XML

              • filename: string

                filename, you can change the filename here

                this property is initialized only for CSV/XML exports

              • nodes: object[]

                array of node objects

                this property is initialized only for CSV/XML exports

              • options: exportOptions

                export options

                this property is initialized only for PDF/PNG/SVG exports

              • pages: any

                an object that discribes pages to be exported

                this property is initialized only for PDF/PNG exports

              • styles: string

                add extra styles

                this property is initialized only for PDF/PNG/SVG exports

            Returns void

      Returns FamilyTree

    • onField(listener: (args: { data: object; element: string; name: string; node: node; value: any }) => boolean | void): FamilyTree
    • The onField() method of the FamilyTree class sets up a function that will be called whenever the specified event is delivered to the target.

      var family = new FamilyTree('#tree', {});
      family.onField((args) => {
      //return false; to cancel
      });
      family.load(nodes);

      Parameters

      • listener: (args: { data: object; element: string; name: string; node: node; value: any }) => boolean | void
          • (args: { data: object; element: string; name: string; node: node; value: any }): boolean | void
          • Parameters

            • args: { data: object; element: string; name: string; node: node; value: any }
              • data: object

                node data json object

              • element: string

                svg or html element of the filed, can be changed in the event

              • name: string

                name of the field

              • node: node

                the node

              • value: any

                value of the filed, can be changed in the event

            Returns boolean | void

      Returns FamilyTree

    • Occurs when the nodes in FamilyTree has been created and loaded to the DOM.

      var family = new FamilyTree('#tree', {});
      family.onInit(() => {
      });
      family.load(nodes);

      Parameters

      • listener: () => void
          • (): void
          • Returns void

      Returns FamilyTree

    • onNodeClick(listener: (args: { event: any; node: node }) => void): FamilyTree
    • On node click event listener.

      var family = new FamilyTree('#tree', {});
      family.onNodeClick(() => {
      //return false; to cancel the operation
      });
      family.load(nodes);

      Parameters

      • listener: (args: { event: any; node: node }) => void
          • (args: { event: any; node: node }): void
          • Parameters

            • args: { event: any; node: node }
              • event: any

                the browser event

              • node: node

                node JSON object

            Returns void

      Returns FamilyTree

    • onNodeDoubleClick(listener: (args: { data: object }) => void): FamilyTree
    • On node double click event listener.

      var family = new FamilyTree('#tree', {});
      family.onNodeDoubleClick(() => {
      //return false; to cancel the operation
      });
      family.load(nodes);

      Parameters

      • listener: (args: { data: object }) => void
          • (args: { data: object }): void
          • Parameters

            • args: { data: object }
              • data: object

                clicked node data

            Returns void

      Returns FamilyTree

    • onNodeTreeMenuShow(listener: (args: { node: object; nodes: object[] }) => void): FamilyTree
    • Occurs when node tree menu button is clicked. Use this event to modify the nodes in the tree menu.

      var family = new FamilyTree('#tree', {});
      family.onNodeTreeMenuShow((args) => {
      });

      Parameters

      • listener: (args: { node: object; nodes: object[] }) => void
          • (args: { node: object; nodes: object[] }): void
          • Parameters

            • args: { node: object; nodes: object[] }
              • node: object
              • nodes: object[]

            Returns void

      Returns FamilyTree

    • The onRedraw event occurs when the family is redrawed.

      var family = new FamilyTree('#tree', {});
      family.onRedraw(() => {
      });
      family.load(nodes);

      Parameters

      • listener: () => void
          • (): void
          • Returns void

      Returns FamilyTree

    • onUpdateNode(listener: (args: { addNodesData: object[]; removeNodeId: string | number; updateNodesData: object[] }) => void): FamilyTree
    • Occurs when the node data has been updated, removed or added.

      var family = new FamilyTree('#tree', {});
      family.onUpdateNode((args) => {
      //return false; to cancel the operation
      });

      Parameters

      • listener: (args: { addNodesData: object[]; removeNodeId: string | number; updateNodesData: object[] }) => void
          • (args: { addNodesData: object[]; removeNodeId: string | number; updateNodesData: object[] }): void
          • Parameters

            • args: { addNodesData: object[]; removeNodeId: string | number; updateNodesData: object[] }
              • addNodesData: object[]
              • removeNodeId: string | number
              • updateNodesData: object[]

            Returns void

      Returns FamilyTree

    Other Methods

    • Adds new node to the nodes collection

      Parameters

      • data: object

        node data

      Returns FamilyTree

    • addChildAndPartnerNodes(id: string | number, childData: object, partnerData: object, callback?: () => void, fireEvent?: boolean): void
    • Adds child and partner

      Parameters

      • id: string | number

        id of the existing partner node

      • childData: object

        child data

      • partnerData: object

        partner data

      • Optional callback: () => void

        called at the end of the animation

          • (): void
          • Returns void

      • Optional fireEvent: boolean

        indicates if the update event will be called or not See doc...

      Returns void

    • addChildNode(data: object, callback?: () => void, fireEvent?: boolean): void
    • Adds child

      Parameters

      • data: object

        child node data

      • Optional callback: () => void

        called at the end of the animation

          • (): void
          • Returns void

      • Optional fireEvent: boolean

        indicates if the update event will be called or not See doc...

      Returns void

    • addClink(from: string | number, to: string | number, label?: string, template?: string): FamilyTree
    • Adds curved link.

      Parameters

      • from: string | number

        from node with id

      • to: string | number

        to node with id

      • Optional label: string

        link label

      • Optional template: string

        link template, for example 'orange'

      Returns FamilyTree

    • addNode(data: object, callback?: () => void, fireEvent?: boolean): void
    • Adds new node to the nodes collection, redraws the family and fires remove event

      Parameters

      • data: object

        node data

      • Optional callback: () => void

        called at the end of animation

          • (): void
          • Returns void

      • Optional fireEvent: boolean

        indicates if the add event will be called or not

      Returns void

    • addParentNode(childId: string | number, type: "mid" | "fid", data: object, callback?: () => void, fireEvent?: boolean): void
    • Adds parrent

      Parameters

      • childId: string | number

        node child id

      • type: "mid" | "fid"

        mother or father

      • data: object

        new added parent data

      • Optional callback: () => void

        called at the end of the animation

          • (): void
          • Returns void

      • Optional fireEvent: boolean

        indicates if the update event will be called or not See doc...

      Returns void

    • addPartnerAndParentNodes(id: string | number, childId: string | number, partnerData: object, callback?: () => void, fireEvent?: boolean): void
    • Parameters

      • id: string | number

        id of the existing partner node

      • childId: string | number

        id of the child node

      • partnerData: object

        partner data

      • Optional callback: () => void

        called at the end of the animation

          • (): void
          • Returns void

      • Optional fireEvent: boolean

        indicates if the update event will be called or not See doc...

      Returns void

    • addPartnerNode(data: object, callback?: () => void, fireEvent?: boolean): void
    • Adds partner node

      data.pids partner id should be an existing id

      Parameters

      • data: object

        new added partner data

      • Optional callback: () => void

        called at the end of the animation

          • (): void
          • Returns void

      • Optional fireEvent: boolean

        indicates if the update event will be called or not See doc...

      Returns void

    • addSlink(from: string | number, to: string | number, label?: string, template?: string): FamilyTree
    • Adds second link.

      Parameters

      • from: string | number

        from node with id

      • to: string | number

        to node with id

      • Optional label: string

        link label

      • Optional template: string

        link template, for example 'orange'

      Returns FamilyTree

    • canRemove(id: string | number): boolean
    • If specified node has assistant/s or partner/s as children will return false.

      Parameters

      • id: string | number

        identification number of the node

      Returns boolean

    • center(nodeId: string | number, options?: null | { childrenState: any; horizontal: boolean; parentState: any; rippleId: string | number; vertical: boolean }, callback?: () => void): void
    • Centers specified node on the screen.

      Parameters

      • nodeId: string | number

        the id of the node

      • Optional options: null | { childrenState: any; horizontal: boolean; parentState: any; rippleId: string | number; vertical: boolean }

        );

      • Optional callback: () => void

        called when the animation completes

          • (): void
          • Returns void

      Returns void

    • changeRoots(id: string | number, roots: (string | number)[], callback?: () => void): void
    • Changes roots order.

      Parameters

      • id: string | number

        id of a node that will not change is position, can be null

      • roots: (string | number)[]

        roots id array in the required order

      • Optional callback: () => void

        called after the roots are changed and animation completes

          • (): void
          • Returns void

      Returns void

    • collapse(id: string | number, ids: (string | number)[], callback?: () => void): void
    • Collapses specified nodes.

      Parameters

      • id: string | number

        the id of the node that will not move

      • ids: (string | number)[]

        node ids that will be collapsed

      • Optional callback: () => void

        called after the animation completes

          • (): void
          • Returns void

      Returns void

    • destroy(): void
    • Destroys the object.

      Returns void

    • draw(action?: action, actionParams?: any, callback?: () => void): void
    • Draws the family.

      Parameters

      • Optional action: action

        Action for example FamilyTree.action.centerNode, default is FamilyTree.action.update

      • Optional actionParams: any

        parameters for the action

      • Optional callback: () => void

        called when the animation completes

          • (): void
          • Returns void

      Returns void

    • expand(id: string | number, ids: (string | number)[], callback?: () => void): void
    • Expands specified nodes.

      Parameters

      • id: string | number

        the id of the node that will not move during the animation

      • ids: (string | number)[]

        node ids that will be expanded

      • Optional callback: () => void

        called after the animation completes

          • (): void
          • Returns void

      Returns void

    • expandCollapse(id: string | number, expandIds: (string | number)[], collapseIds: (string | number)[], callback?: () => void): void
    • Expand/Collapse lists of nodes.

      Parameters

      • id: string | number

        the id of the node that will not move

      • expandIds: (string | number)[]

        expand all nodes with ids

      • collapseIds: (string | number)[]

        collpase all nodes with ids

      • Optional callback: () => void

        called after the animation completes

          • (): void
          • Returns void

      Returns void

    • exportCSV(id?: string | number): void
    • Exports to CSV

      Parameters

      • Optional id: string | number

        if not defained exports all nodes if defined exports childrens See doc...

      Returns void

    • Exports to PDF document

      Parameters

      • Optional options: exportOptions

        export options

      • Optional callback: () => void

        called when the export completes See doc...

          • (): void
          • Returns void

      Returns void

    • exportPDFProfile(options: exportOptions, callback?: () => void): void
    • Exports the details form to PDF.

      Parameters

      • options: exportOptions

        export options

      • Optional callback: () => void

        called when the export completes See doc...

          • (): void
          • Returns void

      Returns void

    • Exports to PNG document

      Parameters

      • Optional options: exportOptions

        export options

      • Optional callback: () => void

        called when the export completes See doc...

          • (): void
          • Returns void

      Returns void

    • exportPNGProfile(options: exportOptions, callback?: () => void): void
    • Exports the details form to PDF.

      Parameters

      • options: exportOptions

        export options

      • Optional callback: () => void

        called when the export completes See doc...

          • (): void
          • Returns void

      Returns void

    • Exports to SVG document

      Parameters

      • Optional options: exportOptions

        export options

      • Optional callback: () => void

        called when the export completes See doc...

          • (): void
          • Returns void

      Returns void

    • fit(callback?: () => void): void
    • Fits the content to the visible area.

      Parameters

      • Optional callback: () => void

        called when the animation completes

          • (): void
          • Returns void

      Returns void

    • generateId(): string
    • Genereates unique identification number that can be used for new nodes

      Returns string

    • get(id: string | number): object
    • Gets node data.

      Parameters

      • id: string | number

        identification number of the node

      Returns object

    • getCollapsedIds(node: node): (string | number)[]
    • Gets collpased node ids of the specifeid node

      Parameters

      Returns (string | number)[]

    • getMenuButton(): HTMLElement
    • Gets menu button html element

      Returns HTMLElement

    • getNode(nodeId: string | number): node
    • getNodeElement(id: string | number): HTMLElement
    • Gets node html element

      Parameters

      • id: string | number

        node id

      Returns HTMLElement

    • getScale(viewBox?: number[]): number
    • Gets the current scale of the family.

      Parameters

      • Optional viewBox: number[]

      Returns number

    • getSvg(): SVGAElement
    • Gets svg html element

      Returns SVGAElement

    • getViewBox(): number[]
    • Gets the view box attribute of the svg html element.

      Returns number[]

    • getXML(): string
    • Gets nodes as xml.

      Returns string

    • height(): number
    • Gets the height of the container.

      Returns number

    • hideTreeMenu(redraw: boolean, callback?: () => void): void
    • Hides the tree menu

      Parameters

      • redraw: boolean
      • Optional callback: () => void

        called at the end of the animation

          • (): void
          • Returns void

      Returns void

    • importCSV(): void
    • importXML(filename?: string): void
    • Imports XML file. See doc...

      Parameters

      • Optional filename: string

      Returns void

    • Load nodes data.

      Parameters

      • data: object[]

        node data array

      Returns FamilyTree

    • Loads nodes from xml.

      Parameters

      • xml: string

        Xml with node structure

      Returns FamilyTree

    • magnify(id: string | number, scale: number, front?: boolean, anim?: null | anim, callback?: () => void): void
    • Magnify(Zoom in) specific node in the family.

      Parameters

      • id: string | number

        id of the node

      • scale: number

        scale to magnify

      • Optional front: boolean

        show on front or back

      • Optional anim: null | anim

        animation type

      • Optional callback: () => void
          • (): void
          • Returns void

      Returns void

    • maximize(id?: string | number, horizontalCenter?: boolean, verticalCenter?: boolean, callback?: () => void): void
    • Maximize the node. Without parameters maximize all nodes.

      Parameters

      • Optional id: string | number

        the id of the node, if id is null, undefined ot empty string will maximize all nodes

      • Optional horizontalCenter: boolean

        center horizontally

      • Optional verticalCenter: boolean

        center vertically

      • Optional callback: () => void

        called when the animation completes

          • (): void
          • Returns void

      Returns void

    • minimize(id?: string | number, callback?: () => void): void
    • Minimize the node. Without parameters minimize all nodes.

      Parameters

      • Optional id: string | number

        the id of the node, if id is null, undefined ot empty string will minimize all nodes

      • Optional callback: () => void

        called when the animation completes

          • (): void
          • Returns void

      Returns void

    • Removes specified node from nodes collection

      Parameters

      • id: string | number

        identification number of the node

      Returns FamilyTree

    • removeClink(from: string | number, to: string | number): FamilyTree
    • Removes curved link.

      Parameters

      • from: string | number

        from node with id

      • to: string | number

        to node with id

      Returns FamilyTree

    • removeNode(id: string | number, callback?: () => void, fireEvent?: boolean): void
    • Removes node if the node can be removed

      Parameters

      • id: string | number

        node id to be removed

      • Optional callback: () => void

        called at the end of the animation

          • (): void
          • Returns void

      • Optional fireEvent: boolean

        indicates if the update event will be called or not See doc...

      Returns void

    • removeSlink(from: string | number, to: string | number): FamilyTree
    • Removes second link.

      Parameters

      • from: string | number

        from node with id

      • to: string | number

        to node with id

      Returns FamilyTree

    • ripple(id: string | number, clientX?: number, clientY?: number): void
    • Animates specified node with ripple animation - highlight the node.

      Parameters

      • id: string | number

        the id of the node

      • Optional clientX: number

        x value of the ripple center in the node

      • Optional clientY: number

        y value of the ripple center in the node

      Returns void

    • search(value: string, searchInFileds?: string[], retrieveFields?: string[]): { __score: number; __searchField: string; __searchMarks: string; id: string | number; name: string }[]
    • Search in the family.

      Parameters

      • value: string

        search for value

      • Optional searchInFileds: string[]

        search in field names

      • Optional retrieveFields: string[]

        retrive data for fields See doc...

      Returns { __score: number; __searchField: string; __searchMarks: string; id: string | number; name: string }[]

    • setLayout(layout: number | layout, lcn?: string): void
    • Parameters

      • layout: number | layout
      • Optional lcn: string

      Returns void

    • setOrientation(orientation: orientation, lcn?: string): void
    • Sets orientation.

      Parameters

      • orientation: orientation

        orientation type

      • Optional lcn: string

        lyout config name for the specified sub tree

      Returns void

    • setViewBox(viewBox: number[]): void
    • Sets the view box attribute of the svg html element.

      Parameters

      • viewBox: number[]

      Returns void

    • shareProfile(id: string | number): void
    • Shares node data, uses build-in device sharing functionallity.

      Parameters

      Returns void

    • showTreeMenu(id: string | number, callback?: () => void): void
    • Shows tree menu

      Parameters

      • id: string | number

        node id

      • Optional callback: () => void

        called at the end of the animation

          • (): void
          • Returns void

      Returns void

    • stateToUrl(): string
    • toggleFullScreen(): void
    • Toggles full screen mode.

      Returns void

    • Updates the node data

      Parameters

      • newData: object

        node data

      Returns FamilyTree

    • updateNode(data: object, callback?: () => void, fireEvent?: boolean): void
    • Updates the node data, redraws the family and fires update event.

      Parameters

      • data: object

        node data

      • Optional callback: () => void

        function called when the animation completes

          • (): void
          • Returns void

      • Optional fireEvent: boolean

        if it set to true the update event is called

      Returns void

    • width(): number
    • Gets the width of the container.

      Returns number

    • zoom(delta: number | boolean, center?: number[], shouldAnimate?: boolean, callback?: () => void): void
    • Zoom out or zoom in the family.

      Parameters

      • delta: number | boolean

        true for zoom in, false for zoom out or scale number, if scale is > 1 it will zoom in and scale < 1 zoom out.

      • Optional center: number[]

        array [x, y], where x is x percantege from the width and y is y percentage from the height.

      • Optional shouldAnimate: boolean

        should animate

      • Optional callback: () => void

        called when the animation completes

          • (): void
          • Returns void

      Returns void

    • animate(element: Object, attrStart?: Object, attrEnd?: Object, duration?: number, func?: anim, callback?: Function, tick?: boolean): void
    • Parameters

      • element: Object
      • Optional attrStart: Object
      • Optional attrEnd: Object
      • Optional duration: number
      • Optional func: anim
      • Optional callback: Function
      • Optional tick: boolean

      Returns void

    • Count all children nodes of the specified id.

      Parameters

      • family: FamilyTree

        FamilyTree instance

      • node: node
      • Optional count: number

      Returns number

    • collapsedChildrenCount(family: FamilyTree, node: node, count?: number): number
    • Parameters

      Returns number

    • convertCsvToNodes(text: string): node[]
    • Parameters

      • text: string

      Returns node[]

    • fileUploadDialog(callback: (file: any) => void): void
    • Parameters

      • callback: (file: any) => void
          • (file: any): void
          • Parameters

            • file: any

            Returns void

      Returns void

    • gradientCircleForDefs(id: string | number, colors: string | string[], r: number, strokeWidth: number): string
    • Parameters

      • id: string | number
      • colors: string | string[]
      • r: number
      • strokeWidth: number

      Returns string

    • isMobile(): boolean
    • Returns boolean

    • isNEU(val: any): boolean
    • is null, empty or undefined

      Parameters

      • val: any

      Returns boolean

    • isTrial(): boolean
    • Checks if the used libraris is licnsed or not

      Returns boolean

    • randomId(): any
    • Returns any

    • wrapText(text: string, field: Object): string
    • Parameters

      • text: string
      • field: Object

      Returns string

    Legend

    • Constructor
    • Property
    • Method
    • Static property
    • Static method
    • Inherited method

    Settings

    Theme

    Generated using TypeDoc