Interface JsPlumbToolkitOptions

Constructor options for a Toolkit instance.

interface JsPlumbToolkitOptions {
    autoSave?: boolean;
    autoSaveDebounceTimeout?: number;
    autoSaveHandler?: ((instance: JsPlumbToolkit) => any);
    autoSaveType?: string;
    beforeConnect?: BeforeConnectInterceptor;
    beforeDetach?: BeforeDetachInterceptor;
    beforeMoveConnection?: BeforeMoveConnectionInterceptor;
    beforeStartConnect?: BeforeStartConnectInterceptor;
    beforeStartDetach?: BeforeStartDetachInterceptor;
    data?: any;
    defaultCost?: number;
    defaultDirected?: boolean;
    doNotUpdateOriginalData?: boolean;
    edgeIdFunction?: IdFunction;
    edgeTypeFunction?: TypeFunction;
    edgeTypeProperty?: string;
    idFunction?: IdFunction;
    maxSelectedEdges?: number;
    maxSelectedGroups?: number;
    maxSelectedNodes?: number;
    modelHeightAttribute?: string;
    modelLeftAttribute?: string;
    modelTopAttribute?: string;
    modelWidthAttribute?: string;
    onAfterAutoSave?: (() => any);
    onAutoSaveError?: (() => any);
    onAutoSaveSuccess?: (() => any);
    onBeforeAutoSave?: (() => any);
    portDataProperty?: string;
    portExtractor?: ((o: ObjectData) => ObjectData[]);
    portIdFunction?: IdFunction;
    portOrderProperty?: string;
    portSeparator?: string;
    portTypeFunction?: TypeFunction;
    portTypeProperty?: string;
    portUpdater?: Function;
    saveHeaders?: any;
    saveUrl?: string;
    selectionCapacityPolicy?: string;
    selectionMode?:
        | "mixed"
        | "isolated"
        | "nodesOnly"
        | "groupsOnly"
        | "edgesOnly";
    typeFunction?: TypeFunction;
    typeProperty?: string;
    undoRedo?: {
        enabled?: boolean;
        maximumSize?: number;
    };
}

Properties

autoSave? autoSaveDebounceTimeout? autoSaveHandler? autoSaveType? beforeConnect? beforeDetach? beforeMoveConnection? beforeStartConnect? beforeStartDetach? data? defaultCost? defaultDirected? doNotUpdateOriginalData? edgeIdFunction? edgeTypeFunction? edgeTypeProperty? idFunction? maxSelectedEdges? maxSelectedGroups? maxSelectedNodes? modelHeightAttribute? modelLeftAttribute? modelTopAttribute? modelWidthAttribute? onAfterAutoSave? onAutoSaveError? onAutoSaveSuccess? onBeforeAutoSave? portDataProperty? portExtractor? portIdFunction? portOrderProperty? portSeparator? portTypeFunction? portTypeProperty? portUpdater? saveHeaders? saveUrl? selectionCapacityPolicy? selectionMode? typeFunction? typeProperty? undoRedo?

Properties

OptionalautoSave

autoSave?: boolean

Whether or not to automatically save the data when an update to a model object occurs. If you set this then you need to provide saveUrl or autoSaveHandler.

OptionalautoSaveDebounceTimeout

autoSaveDebounceTimeout?: number

A debounce timeout to use when the autoSave functionality is turned on. You can use this to reduce the number of calls to your auto save endpoint.

OptionalautoSaveHandler

autoSaveHandler?: ((instance: JsPlumbToolkit) => any)

A handler for the auto save operation. You need to provide this or saveUrl if you set autoSave:true.

OptionalautoSaveType

autoSaveType?: string

Optional type to use for auto save. Defaults to "json", the default input/output format the Toolkit uses. If you have registered your own exporter you can use this parameter to instruct the Toolkit to auto save via that exporter.

OptionalbeforeConnect

beforeConnect?: BeforeConnectInterceptor

Definition of a function to use as a beforeConnect interceptor.

Param: source

The source vertex for the new edge

Param: target

The target vertex for the new edge

Param: userInstigated

If true, the new edge came from user activity, with a pointer device or touch input. This will be false whenever the edge is added programmatically, either during a data load or via the addEdge method of the Toolkit.

OptionalbeforeDetach

beforeDetach?: BeforeDetachInterceptor

A function to run before the given edge is detached from the given source vertex. If this method returns false, the detach will be aborted.

Param: source

Edge's source.

Param: target

Candidate target for the edge

Param: edge

The edge that is being detached.

OptionalbeforeMoveConnection

beforeMoveConnection?: BeforeMoveConnectionInterceptor

A function to run before an edge of the given type is relocated from its current source or target to a new source or target. Returning false from this method will abort the move.

Param: source

Candidate source. May be the edge's current source, or may be a new source.

Param: target

Candidate target. May be the edge's current target, or may be a new target.

Param: edge

The edge that is being moved.

OptionalbeforeStartConnect

beforeStartConnect?: BeforeStartConnectInterceptor

A function to run before an edge of the given type is dragged from the given source. Returning false from this method will abort the connection.

Param: source

Param: type

OptionalbeforeStartDetach

beforeStartDetach?: BeforeStartDetachInterceptor

A function to run before the given edge is detached from the given source vertex. If this method returns false, the detach will be aborted. The difference between this and beforeDetach is that this method is fired as soon as a user tries to detach an edge from an endpoint in the UI, whereas beforeDetach allows a user to detach the edge in the UI.

Param: source

Param: edge

Optionaldata

data?: any

Data to load directly after Toolkit has been created.

OptionaldefaultCost

defaultCost?: number

The default cost for an edge. Default value is 1.

OptionaldefaultDirected

defaultDirected?: boolean

Whether edges are directed by default. The default value for this is true - edges are directed by default.

OptionaldoNotUpdateOriginalData

doNotUpdateOriginalData?: boolean

Sets whether or not the Toolkit manipulates the original dataset when updates are made. Defaults to true.

See

setDoNotUpdateOriginalData

OptionaledgeIdFunction

edgeIdFunction?: IdFunction

A function to use to determine the ID of some edge from its data. By default the Toolkit uses the value of the object's id property.

OptionaledgeTypeFunction

edgeTypeFunction?: TypeFunction

A function to use to determine the type of some edge from its data object. By default the Toolkit uses the value of the object's type property.

OptionaledgeTypeProperty

edgeTypeProperty?: string

The name of the property that identifies a given edge's type. By default this is the type property. If you do not set this but you do set typeProperty, that value will be used.

OptionalidFunction

idFunction?: IdFunction

A function to use to determine the ID of some data object. By default the Toolkit uses the value of the object's id property.

OptionalmaxSelectedEdges

maxSelectedEdges?: number

The maximum number of edges that can be selected at any one time. Defaults to Infinity.

OptionalmaxSelectedGroups

maxSelectedGroups?: number

The maximum number of groups that can be selected at any one time. Defaults to Infinity.

OptionalmaxSelectedNodes

maxSelectedNodes?: number

The maximum number of nodes that can be selected at any one time. Defaults to Infinity.

OptionalmodelHeightAttribute

modelHeightAttribute?: string

The name of the property inside a vertex's data that identifies its height. Defaults to height.

OptionalmodelLeftAttribute

modelLeftAttribute?: string

The name of the property inside a vertex's data that identifies its location in the y axis. Defaults to top.

OptionalmodelTopAttribute

modelTopAttribute?: string

The name of the property inside a vertex's data that identifies its location in the x axis. Defaults to left.

OptionalmodelWidthAttribute

modelWidthAttribute?: string

The name of the property inside a vertex's data that identifies its width. Defaults to width.

OptionalonAfterAutoSave

onAfterAutoSave?: (() => any)

A function to run after the auto save has run.

OptionalonAutoSaveError

onAutoSaveError?: (() => any)

A function to call when an auto save operation experienced an error.

OptionalonAutoSaveSuccess

onAutoSaveSuccess?: (() => any)

A function to call when an auto save operation was successful.

OptionalonBeforeAutoSave

onBeforeAutoSave?: (() => any)

A function to run before auto save runs.

OptionalportDataProperty

portDataProperty?: string

The name of a property that will exist inside the backing data for nodes/group, and which represents a list of ports pertaining to that node/group. When a node/group is rendered, if this property is set, the Toolkit will consider the value of this property to be a list of port data object. So this property's value should be of type Array<ObjectData>

OptionalportExtractor

portExtractor?: ((o: ObjectData) => ObjectData[])

A function to use to extract an array of ports from the data representing some node/group. Whenever a node/group is rendered, the Toolkit will use this method, if provided, to determine a list of ports for that node/group. If you use this you probably also want to define a portUpdater. Note that if you provide the portDataProperty then you do not need to set this.

OptionalportIdFunction

portIdFunction?: IdFunction

A function to use to determine the ID of some port from its data. By default the Toolkit uses the value of the object's id property.

OptionalportOrderProperty

portOrderProperty?: string

The name of a property inside of each port's data that can be used to order the ports. For instance, you might have ports that have a rank property, which is a number. The Toolkit will sort the ports according to the natural ordering of this property.

OptionalportSeparator

portSeparator?: string

The character to use in port identifiers. Defaults to ., eg. someVertex.somePort.

OptionalportTypeFunction

portTypeFunction?: TypeFunction

A function to use to determine the type of some port from its data object. By default the Toolkit uses the value of the object's type property.

OptionalportTypeProperty

portTypeProperty?: string

The name of the property that identifies a given port's type. By default this is the type property. If you do not set this but you do set typeProperty, that value will be used.

OptionalportUpdater

portUpdater?: Function

A function to use to update a given node/group's list of ports. Note that if you provide the portDataProperty then you do not need to set this.

OptionalsaveHeaders

saveHeaders?: any

A map of HTTP headers to send along with an auto save request.

OptionalsaveUrl

saveUrl?: string

URL for auto save endpoint.

OptionalselectionCapacityPolicy

selectionCapacityPolicy?: string

Defines the action taken when appending an object that would take the selection above its limit for the given object type. This can be either Selection.DISCARD_EXISTING (the default) or Selection.DISCARD_NEW.

OptionalselectionMode

selectionMode?:
    | "mixed"
    | "isolated"
    | "nodesOnly"
    | "groupsOnly"
    | "edgesOnly"

Optional mode for the Toolkit's current selection. Defaults to the Selection default - SelectionModes.mixed.

OptionaltypeFunction

typeFunction?: TypeFunction

A function to use to determine the type of some data object. By default the Toolkit uses the value of the object's type property.

OptionaltypeProperty

typeProperty?: string

The name of the property that identifies a given object's type. By default this is the type property.

OptionalundoRedo

undoRedo?: {
    enabled?: boolean;
    maximumSize?: number;
}

Configuration for undo/redo

Type declaration

  • Optionalenabled?: boolean

    Whether or not undo/redo is enabled. Defaults to true.

  • OptionalmaximumSize?: number

    Maximum size of the undo stack. Defaults to 50.

Settings

Member Visibility

On This Page

Properties
Version :