PCUI Graph API Reference - v4.1.0
    Preparing search index...

    Class Graph

    Represents a new Graph.

    Hierarchy

    Index

    Constructors

    • Creates a new Graph.

      Parameters

      • schema: object

        The graph schema.

      • Optionaloptions: {
            adjustVertices?: object;
            contextMenuItems?: object[];
            defaultStyles?: object;
            dom?: HTMLElement;
            edgeHoverEffect?: boolean;
            incrementNodeNames?: boolean;
            initialData?: object;
            passiveUIEvents?: boolean;
            readOnly?: boolean;
            restrictTranslate?: boolean;
        } = {}

        The graph configuration. Optional.

        • OptionaladjustVertices?: object

          If true, multiple edges connected between two nodes will be spaced apart.

        • OptionalcontextMenuItems?: object[]

          The context menu items to add to the graph.

        • OptionaldefaultStyles?: object

          Used to override the graph's default styling. Check ./constants.js for a full list of style properties.

        • Optionaldom?: HTMLElement

          If supplied, the graph will be attached to this element.

        • OptionaledgeHoverEffect?: boolean

          Whether the graph should show an edge highlight effect when the mouse is hovering over edges. Optional. Defaults to true.

        • OptionalincrementNodeNames?: boolean

          Whether the graph should increment the node name when a node with the same name already exists. Optional. Defaults to false.

        • OptionalinitialData?: object

          The graph data to initialize the graph with.

        • OptionalpassiveUIEvents?: boolean

          If true, the graph will not update its data and view upon user interaction. Instead, these interactions can be handled explicitly by listening to fired events. Optional. Defaults to false.

        • OptionalreadOnly?: boolean

          Whether the graph is read only. Optional. Defaults to false.

        • OptionalrestrictTranslate?: boolean

          Whether the graph should restrict the translate graph operation to the graph area. Optional. Defaults to false.

      Returns Graph

    Accessors

    • get data(): object

      The current graph data. Contains an object with any nodes and edges present in the graph. This can be passed into the graph constructor to reload the current graph.

      Returns object

    Methods

    • Add an edge to the graph.

      Parameters

      • edge: object

        The edge to add.

      • edgeId: number

        The edge id for the new edge.

      Returns void

    • Add a node to the graph.

      Parameters

      • node: object

        The node to add.

      Returns void

    • Delete an edge from the graph.

      Parameters

      • edgeId: string

        The edge to delete.

      Returns void

    • Delete a node from the graph.

      Parameters

      • nodeId: number

        The node to delete.

      Returns void

    • Deselect the currently selected item in the graph.

      Returns void

    • Destroy the graph. Clears the graph from the DOM and removes all event listeners associated with the graph.

      Returns void

    • Get the current center position of the viewport in the graph.

      Returns object

      The current center position of the viewport in the graph as an object containing x and y.

    • Get the current scale of the graph.

      Returns number

      The current scale of the graph.

    • Convert a position in window space to a position in graph space.

      Parameters

      • pos: object

        A position in the window, as an object containing x and y.

      Returns object

      The position in the graph based on the given window position, as an object containing x and y.

    • Add an event listener to the graph.

      Parameters

      • eventName: string

        The name of the event to listen for.

      • callback: Function

        The callback to call when the event is triggered.

      Returns void

    • Select an edge in the current graph.

      Parameters

      • edge: object

        The edge to select

      • edgeId: number

        The edge id of the edge to select

      Returns void

    • Select a node in the current graph.

      Parameters

      • node: object

        The node to select

      Returns void

    • Set the center of the viewport to the given position.

      Parameters

      • posX: number

        The x position to set the center of the viewport to.

      • posY: number

        The y position to set the center of the viewport to.

      Returns void

    • Set the scale of the graph.

      Parameters

      • scale: number

        The new scale of the graph.

      Returns void

    • Set the error state of a node attribute.

      Parameters

      • nodeId: number

        The node to update.

      • attributeName: string

        The name of the attribute to update.

      • value: boolean

        Whether the attribute should be set in the error state.

      Returns void

    • Update the value of an attribute of a node.

      Parameters

      • nodeId: number

        The node to update.

      • attributeName: string

        The name of the attribute to update.

      • value: object

        The new value for the attribute.

      Returns void

    • Update the position of a node.

      Parameters

      • nodeId: number

        The node to add.

      • pos: object

        The new position, given as an object containing x and y properties.

      Returns void

    • Update the type of a node.

      Parameters

      • nodeId: number

        The node to update.

      • nodeType: string

        The new type for the node.

      Returns void