Skip to main content

VisuallyJsModel

Core VisuallyJs model functionality. This class provides the basic data model of an directed/undirected graph, and offers methods to add/update/remove nodes, groups, edges and ports. Multiple renderers can share one instance of the model.

Extended by

Implements

Methods

addAllEdgesToSelection()

addAllEdgesToSelection(): void

Adds all the edges in the model to the current selection.

Returns

void


addEdge()

addEdge(params): Edge

Adds an Edge to the Graph.

Parameters

params

AddEdgeOptions

Options for the new edge

Returns

Edge

The Edge that was added.

Implementation of

WriteableDatasource.addEdge


addFactoryGroup()

addFactoryGroup(type, data?, continueCallback?, abortCallback?, useTransaction?): void

Adds a Group by type, running the data generation for the node through the current GroupFactory. This is different from addGroup in that with addGroup you are supplying the final data and your GroupFactory is not called. This method can be called with one, two or three arguments. A single argument is considered to be the new Group's type, and a backing data object will be created with this set, and no callback will occur. If you provide two arguments the second argument may be either the new Group's backing data OR a callback to hit with the newly created Group. With three arguments the second argument is the Group's backing data and the third is a callback to hit with the newly created Group.

Parameters

type

string

Required. Type of the object to create. type will be passed as the first argument to your group factory.

data?

ObjectData

Optional backing data for the Group.

continueCallback?

Function

Optional function to call with the newly created Group.

abortCallback?

Function

Optional function to call if the group factory aborted

useTransaction?

boolean

Returns

void


addFactoryNode()

addFactoryNode(type, data?, continueCallback?, abortCallback?, useTransaction?): void

Adds a Node by type, running the data generation for the node through the current NodeFactory. This is different from addNode in that with addNode you are supplying the final data and your NodeFactory is not called. This method can be called with one, two or three arguments. A single argument is considered to be the new Node's type, and a backing data object will be created with this set, and no callback will occur. If you provide two arguments the second argument may be either the new Node's backing data OR a callback to hit with the newly created Node. With three arguments the second argument is the Node's backing data and the third is a callback to hit with the newly created Node.

Parameters

type

string

Required. Type of the object to create. type will be passed as the first argument to your node factory.

data?

ObjectData

Optional backing data for the Node.

continueCallback?

Function

Optional function to call with the newly created Node.

abortCallback?

Function

Optional function to call if the factory aborted the node add.

useTransaction?

boolean

Whether or not to add this new factory node in a transaction.

Returns

void


addGroup()

addGroup(data, eventInfo?): Group

Adds a new Group.

Parameters

data

ObjectData

Backing data for the Group.

eventInfo?

any

Used internally, sometimes, by VisuallyJs.

Returns

Group

The Group that was added.


addGroupTemplate()

addGroupTemplate(name, template): void

Registers a group template with the model.

Parameters

name

string

Name of the template.

template

GroupTemplate

Template content, as a string.

Returns

void


addGroupWithTemplate()

addGroupWithTemplate(data, template): Group

Adds a group to the model using a GroupTemplate. This operation runs in a single transaction.

Parameters

data

ObjectData

Data for the root group.

template

The template defining internal structure, OR the name of a registered template.

string | GroupTemplate

Returns

Group


addNewPort()

addNewPort(obj, type, portData?): void

Adds a new Port to some Node. This will call the current portFactory to get the data for a new Port.

Parameters

obj

node/group or id of the node/group to add a new Port to.

string | Node | Group

type

string

Type of Port to add.

portData?

ObjectData

Data to pass to the PortFactory.

Returns

void


addNode()

addNode(data, eventInfo?): Node

Adds a Node with the given data. If the data is null, VisuallyJs creates an empty object and assigns a uuid as the Node's id. If no id can be derived for the given data, VisuallyJs creates a uuid and sets it as the data object's 'id' member. This method also calls the current portExtractor function, if one was supplied. Its purpose is to extract any Ports from the data for some given Node.

Parameters

data

ObjectData

The Node's backing data - from your data model.

eventInfo?

any

Optional data member that VisuallyJs will pass into any registered event listeners. This can be used by the UI layer, for instance, to track the position on screen of any newly added elements.

Returns

Node

A Node object. Your original data is available via the data member. The Node's id is available via the id member.


addNodes()

addNodes(nodeList): VisuallyJsModel

Adds a list of Nodes.

Parameters

nodeList

ObjectData[]

An array of objects, one for each Node to be added.

Returns

VisuallyJsModel


addPathToSelection()

addPathToSelection(params): void

Appends the Path from source to target to the current selection. If there is no current selection, obj becomes it. If the Path does not exist, there is no selection.

Parameters

params

Path params

edgeFilter?

(n) => boolean

nodeFilter?

(n) => boolean

source

string | Vertex

ID of source, or source Node/Port

strict?

boolean

target

string | Vertex

ID of target, or target Node/Port

Returns

void


addPort()

addPort(vertex, data): Port

Adds a Port from existing data to some Node/Group. This is distinct from addNewPort, because in this case the data for the Port already exists.

Parameters

vertex

Node/Group or id of the Node/Group to add the Port to.

string | Node | Group

data

ObjectData

Data for the Port.

Returns

Port

The port that was added.

Implementation of

WriteableDatasource.addPort


addToGroup()

addToGroup(node, group, position?): boolean

Adds a Node/Group to a Group.

Parameters

node

Node to add

string | Node | Group

group

Group to add the Node/Group to

string | Group

position?

PointXY

Returns

boolean

True if added, false otherwise.


addToSelection()

addToSelection(obj): void

Appends obj to the current selection. If there is no current selection, obj becomes it.

Parameters

obj

Object to select. May be a Node/Group/Port/Edge or an array of any of these, or a Vertex id, or a Path.

string | string[] | Base | Base[] | Path

Returns

void


append()

append(params): VisuallyJsModel

Appends some data to the dataset, either via ajax, or directly from a JS object. The only difference between this and load is the events that are fired during the loading process.

Parameters

params

LoadOptions

Append parameters.

Returns

VisuallyJsModel


batch()

batch(fn): void

Suspends rendering and then runs the given function, unsuspending rendering afterwards and doing a refresh. This method is just a convenience method that handles suspending and subsequent enabling of rendering. You might use this if you're bulk loading objects, or maybe you want to add a Node and one or more Edges before the layout recomputes.

Parameters

fn

() => any

Function to run.

Returns

void

Implementation of

WriteableDatasource.batch


bind()

bind<T>(event, listener, insertAtStart?): EventGenerator

Bind a listener to the named event, optionally inserting the listener at the head of the queue for the given event.

Type Parameters

T

T = any

The type of the payload you expect to be passed to your callback. Using this is helpful to ensure your callbacks are typed correctly.

Parameters

event

any

Name of the event to bind

listener

(payload, evt?) => any

Function to bind to the event

insertAtStart?

boolean

Defaults to false. If true, this handler is inserted at the head of the list of listeners for the given event.

Returns

EventGenerator

Implementation of

WriteableDatasource.bind

Inherited from

OptimisticEventGenerator.bind


bindAll()

bindAll<T>(events, listener, insertAtStart?): EventGenerator

Bind a listener to all of the named events, optionally inserting each one at the head of the queue for the given event.

Type Parameters

T

T = any

The type of the payload you expect to be passed to your callback. Using this is helpful to ensure your callbacks are typed correctly.

Parameters

events

any[]

listener

(payload, evt?) => any

insertAtStart?

boolean

Returns

EventGenerator

Inherited from

OptimisticEventGenerator.bindAll


bindUnchecked()

bindUnchecked<T>(event, listener, insertAtStart?): EventGenerator

Bind an event listener. This method can be used with a type parameter by call sites; although it's not necessary it can be helpful to use this to ensure you've thought about what the payload to your event handler is going to be.

Type Parameters

T

T = any

The type of the payload you expect to be passed to your callback. Using this is helpful to ensure your callbacks are typed correctly.

Parameters

event

string

Name of the event(s) to bind to.

listener

(a, e?) => any

Function to bind to the given event(s)

insertAtStart?

boolean

Whether or not to insert this listener at the head of the listener queue. Defaults to false.

Returns

EventGenerator

Inherited from

OptimisticEventGenerator.bindUnchecked


clear()

clear(): VisuallyJsModel

Fires a 'graphClearStart' event, clears the graph, then fires a graphClearEnd event.

Returns

VisuallyJsModel

The current Toolkit instance.


clearEdgeGeometry()

clearEdgeGeometry(edge): void

Clears the geometry for some edge. The edge will be repainted using the default route calculation, and an entry will be added to the undo stack.

Parameters

edge

Edge

Edge to clear geometry for.

Returns

void


clearSelection()

clearSelection(): void

Clears the current selection and fires a selectionCleared event.

Returns

void


commitTransaction()

commitTransaction(commitAll?): void

Commits any changes made in the current transaction to the undo stack. If there is no current transaction this method does nothing.

Parameters

commitAll?

boolean

Returns

void

Implementation of

WriteableDatasource.commitTransaction


connect()

connect(params): Edge

Connects two nodes/ports (or a combination of the two), by ID. By default, this method will create nodes that are missing. Port ids are specified with a dotted syntax, eg foo.bar refers to the port "bar" on the node "foo".

Parameters

params

ConnectOptions

Connect parameters.

Returns

Edge

The new Edge.


eachEdge()

eachEdge(fn): void

Iterates through all Edges in the model one at a time. You should not perform destructive editing of the dataset inside one of these loops.

Parameters

fn

(idx, edge) => void

A function that takes (index, edge) as arguments and is applied for every Node in the VisuallyJs instance.

Returns

void

Implementation of

WriteableDatasource.eachEdge


eachGroup()

eachGroup(fn): void

Iterates through all Groups in the model one at a time. You should not perform destructive editing of the dataset inside one of these loops.

Parameters

fn

(idx, group) => void

A function that takes (index, node) as arguments and is applied for every Group in the VisuallyJs instance.

Returns

void

Implementation of

WriteableDatasource.eachGroup


eachNode()

eachNode(fn): void

Iterates through all Nodes in the model one at a time. You should not perform destructive editing of the dataset inside one of these loops.

Parameters

fn

(idx, node) => void

A function that takes (index, node) as arguments and is applied for every Node in the VisuallyJs instance.

Returns

void

Implementation of

WriteableDatasource.eachNode


eachVertex()

eachVertex(fn): void

Combines eachNode and eachGroup into one method.

Parameters

fn

(idx, vertex) => void

Returns

void

Implementation of

WriteableDatasource.eachVertex


exists()

exists(...objects): boolean

Returns whether or not object(s) exist for the given id(s).

Parameters

objects

...any[]

List of ids to check existence for. This method takes an arbitrary number of arguments.

Returns

boolean

True if objects exist for all given ids, false otherwise.


exportData()

exportData(params?): any

Exports the current data to JSON.

Parameters

params?

ExportOptions

Export parameters

Returns

any

JSON payload.


filter()

filter<T>(spec, includePartials?): VisuallyJsSelection

Filter the dataset and return a Selection containing matches. You can optionally provide a type parameter to indicate the type of objects you expect back in the Selection.

Type Parameters

T

T = any

Parameters

spec

(o) => boolean | ObjectData

Either a function which is passed every object in the dataset and expected to return true to indicate inclusion, or an object containing key:value pairs to match in the backing data of each object in the dataset

includePartials?

boolean

If true, objects whose data matches one or more, but not all, of the pairs in spec will be included in the result. By default objects have to match all the pairs in spec to be included in the result.

Returns

VisuallyJsSelection

Implementation of

WriteableDatasource.filter


findGraphObject()

findGraphObject(spec): Edge | Vertex | Graph

Finds the object that matches the given spec.

Parameters

spec

If a string, a Node/Port matching that id is retrieved. Otherwise if spec is already a Graph object (Node or Port), it is returned.

string | Edge | Vertex

Returns

Edge | Vertex | Graph


flushUndoRedo()

flushUndoRedo(): void

Clears out the undo/redo stacks and discards (neither commits nor rolls back) any existing transaction.

Returns

void


getAllEdges()

getAllEdges(): Edge[]

Get all Edges in the model

Returns

Edge[]

Implementation of

WriteableDatasource.getAllEdges


getAllEdgesFor()

getAllEdgesFor(obj, filter?): Edge[]

Gets all edges for the given Node, Port or Group.

Parameters

obj

Vertex

Object to retrieve edges for.

filter?

(e) => boolean

Optional filter function for edge selection.

Returns

Edge[]

Implementation of

WriteableDatasource.getAllEdgesFor


getAncestors()

getAncestors(vertex): Group[]

Gets a list of groups that are ancestors of the given node/group (or port, for which we first resolve the node/group it resides on). The list of ancestors is ordered in terms of their proximity to the focus, ie. the first entry is the focus vertex's immediate parent.

Parameters

vertex

Vertex

Returns

Group[]

Implementation of

WriteableDatasource.getAncestors


getCluster()

getCluster(vertex): Cluster

Calculates the set of nodes and groups (and edges) that are connected to the given vertex.

Parameters

vertex

a Cluster - a list of vertices and a list of edges that are connected to the given vertex.

string | Node | Group

Returns

Cluster


getClusters()

getClusters(): Cluster[]

Calculates "clusters" of nodes (and groups), where a 'cluster' is a set of Nodes/Groups that are connected. Direction of connections is not taken into account. Nodes that are children of Groups are included in all cluster calculations, which might cause some weird situations, but this functionality is mostly intended just for Nodes anyway.

Returns

Cluster[]

An array of arrays, each entry being a list of nodes in the cluster.


getDescendants()

getDescendants(vertex): (Node | Group)[]

Gets a list of nodes/groups that are descendants of the given group.

Parameters

vertex

Group

Returns

(Node | Group)[]

Implementation of

WriteableDatasource.getDescendants


getEdge()

getEdge(edgeId): Edge

Gets an Edge by id, or if the given object is already an Edge, hands that back.

Parameters

edgeId

string

ID of the Edge to retrieve.

Returns

Edge

The requested Edge, if found, otherwise null.

Implementation of

WriteableDatasource.getEdge


getEdgeCount()

getEdgeCount(): number

Returns the total number of edges in the graph.

Returns

number

Implementation of

WriteableDatasource.getEdgeCount


getEdges()

getEdges(params?): Edge[]

Gets a set of edges.

Parameters

params?

EdgeSelectionParams

Options for the edge selection

Returns

Edge[]


getEdgeType()

getEdgeType(edgeData): string

Gets the type of the Edge represented by the given JS object.

Parameters

edgeData

ObjectData

Edge's data. Note: this is NOT an Edge object, it is the backing data. You can use getType to get the type for some Toolkit object.

Returns

string

Either the Edge's type, if set, or "default".

Implementation of

WriteableDatasource.getEdgeType


getGraph()

getGraph(): Graph

Returns the current Graph.

Returns

Graph

The underlying Graph.

Implementation of

WriteableDatasource.getGraph


getGroup()

getGroup(groupId): Group

Gets a Group by its ID, or if the object is already a Group, hands that back.

Parameters

groupId

string

Returns

Group

The requested Group, if found, otherwise null.

Implementation of

WriteableDatasource.getGroup


getGroupAt()

getGroupAt(idx): Group

Returns the Group at the given index, null if not found.

Parameters

idx

number

Index into group list

Returns

Group

Implementation of

WriteableDatasource.getGroupAt


getGroupCount()

getGroupCount(): number

Returns the total number of group in the Graph.

Returns

number

Implementation of

WriteableDatasource.getGroupCount


getGroupId()

getGroupId(group): string

Gets the id of the Group represented by the given arguments. If this is a JS object, we extract the id using the current idFunction. Otherwise we just pass it back as-is.

Parameters

group

Object from which to retrieve id.

string | ObjectData

Returns

string

Implementation of

WriteableDatasource.getGroupId


getGroups()

getGroups(): Group[]

Returns all the Groups in the Graph.

Returns

Group[]

Implementation of

WriteableDatasource.getGroups


getGroupType()

getGroupType(groupData): string

Gets the type of the Group represented by the given JS object. We first try for a return value from the current typeFunction, but if that returns nothing we just return 'default'.

Parameters

groupData

ObjectData

Groups's data. Note: this is NOT a Group object, it is the backing data. You can use getType to get the type for some model object.

Returns

string

Either the object's type, or default.

Implementation of

WriteableDatasource.getGroupType


getModel()

getModel(): DataModel

Gets the model registered with this VisuallyJs instance, if any. Use VisuallyJs's model to map data model event handlers and other data model considerations such as the maximum number of connections a Port allows

Returns

DataModel

Current model. May be null.

Implementation of

WriteableDatasource.getModel


getNode()

getNode(nodeId): Node

Gets the Node with the given id.

Parameters

nodeId

string

Returns

Node

Implementation of

WriteableDatasource.getNode


getNodeAt()

getNodeAt(idx): Node

Returns the Node at the given index.

Parameters

idx

number

Returns

Node

The Node at the given index, null if not found.

Implementation of

WriteableDatasource.getNodeAt


getNodeCount()

getNodeCount(): number

Returns the count of nodes in the Graph.

Returns

number

The count of Nodes in the Graph.

Implementation of

WriteableDatasource.getNodeCount


getNodeId()

getNodeId(node): string

Gets the id of the Node represented by the given arguments. If this is a JS object, we extract the id using the current idFunction. Otherwise we just pass it back as-is.

Parameters

node

Object from which to retrieve id.

string | ObjectData

Returns

string

Implementation of

WriteableDatasource.getNodeId


getNodes()

getNodes(): Node[]

Returns all the nodes in the Graph.

Returns

Node[]

All the Nodes in the graph.

Implementation of

WriteableDatasource.getNodes


getNodeType()

getNodeType(nodeData): string

Gets the type of the Node represented by the given JS object. We first try for a return value from the current typeFunction, but if that returns nothing we just return 'default'.

Parameters

nodeData

ObjectData

Node's data. Note: this is NOT a Node object, it is the backing data. You can use getType to get the type for some Toolkit object.

Returns

string

Either the object's type, or default.

Implementation of

WriteableDatasource.getNodeType


getObjectInfo()

getObjectInfo<T>(obj): ObjectInfo<T>

Finds information related to the given object, which may be an existing model object, a Node/Group/Edge id, or the backing data for some object.

Type Parameters

T

T

Parameters

obj

A Node/Group/Edge id, or Node, Port, Group or Edge

string | Node | Edge | Group | Port | ObjectData

Returns

ObjectInfo<T>

ObjectInfo

Implementation of

WriteableDatasource.getObjectInfo


getPath()

getPath(params): Path

Gets a Path from some source vertex to some target vertex.

Parameters

params

PathOptions

Path spec params

Returns

Path


getPort()

getPort(portId): Port

Gets a port by its full id

Parameters

portId

string

ID of the Port to retrieve, in nodeId.portId syntax.

Returns

Port

The requested port, if found, otherwise null.


getPortId()

getPortId(port): string

Gets the id of the Port represented by the given arguments. If this is a JS object, we extract the id using the current portIdFunction. Otherwise we just pass it back as-is.

Parameters

port

ObjectData

Returns

string

Port's id, if we could resolve it, otherwise the object we were given.

Implementation of

WriteableDatasource.getPortId


getPortType()

getPortType(port): string

Gets the type of the Port represented by the given JS object

Parameters

port

ObjectData

Returns

string

Either the port's type, if set, or "default".

Implementation of

WriteableDatasource.getPortType


getRenderer()

getRenderer<E>(id): VisuallyJsRenderer<E>

Gets a renderer by the id parameter supplied to the render call (which is by default null, and only renderers for which an id was supplied are retrievable via this method)

Type Parameters

E

E

Parameters

id

string

ID of the renderer to retrieve.

Returns

VisuallyJsRenderer<E>

Either a Renderer that was registered against the given id, or null if none found.


getSelection()

getSelection(): VisuallyJsSelection

Gets the current Selection for this model

Returns

VisuallyJsSelection

Current Selection.


getType()

getType(obj): string

Gets the type of the given Object. This is not a type such as Node, Port or Edge - this is the type of the object as defined by your system to identify types; these are the types used to lookup objects in the view.

Parameters

obj

Base

Object to retrieve type for

Returns

string

The object's type.

Implementation of

WriteableDatasource.getType


getVertex()

getVertex(id): Node | Group

Gets the Vertex with the given id.

Parameters

id

string

Returns

Node | Group

Implementation of

WriteableDatasource.getVertex


isAncestor()

isAncestor(focus, possibleAncestor): boolean

Returns whether or not possibleAncestor is in fact an ancestor of the given focus node/group

Parameters

focus

Vertex

Vertex to test

possibleAncestor

Group

Group which may be an ancestor of focus

Returns

boolean

Implementation of

WriteableDatasource.isAncestor


isDescendantGroup()

isDescendantGroup(possibleDescendant, ancestor): boolean

Determine whether possibleDescendant is in fact a descendant of the ancestor group

Parameters

possibleDescendant

Group

Group to test

ancestor

Group

Ancestor group

Returns

boolean

Implementation of

WriteableDatasource.isDescendantGroup


load()

load(params): VisuallyJsModel

Loads some data, either via ajax, or directly from a JS object.

Parameters

params

LoadOptions

Load options.

Returns

VisuallyJsModel


mergeTransaction()

mergeTransaction(fn): string | false

Opens a transaction and runs the given function. If the function returns true, the model changes from this transaction are merged with the previous entry on the undo stack, to form a new compound action, which can then be treated atomically. If the function return false, the transaction is rolled back and nothing is merged. If an uncommitted transaction is active when this method is called, the actions in this transaction are appended to the transaction in progress. This method is useful for situations where some user activity has resulted in a model change, and you want to respond with a further set of model changes, but you want to be able to undo/redo all of the actions as one unit.

Parameters

fn

() => any

Returns

string | false

A string providing the associated transaction's ID, null if nothing was merged to a transaction.


openTransaction()

openTransaction(cleanupAction?): string

Opens a transaction.

Parameters

cleanupAction?

TransactionCleanupAction

What to do if a transaction already exists. If you supply nothing, or an inappropriate value, here and there is a current transaction, then an Error is thrown.

Returns

string

Implementation of

WriteableDatasource.openTransaction


redo()

redo(): void

Redo the latest operation that was undone, if there is one. Otherwise does nothing.

Returns

void


remove()

remove(obj, doNotRemoveGroupChildren?): void

Attempts to identify the given argument as a model object, and, if successful, removes it. If you pass in a group or group ID to this method, the group and all of its children will, by default, be removed. You can override that behaviour by setting doNotRemoveGroupChildren to true.

Parameters

obj

any

A string representing the ID of some model object, or a model object of some type.

doNotRemoveGroupChildren?

boolean

Whether or not to remove group children. Defaults to false, ie. group children will be removed by default.

Returns

void


removeEdge()

removeEdge(edge, renderer?): VisuallyJsModel

Removes an Edge from the Graph.

Parameters

edge

The Edge to remove, as either an Edge object or its id.

string | Edge

renderer?

any

The source for the removeEdge operation. For internal use.

Returns

VisuallyJsModel

The model instance.

Implementation of

WriteableDatasource.removeEdge


removeFromGroup()

removeFromGroup(node): Group

Removes a Node/Group from a Group.

Parameters

node

Node/Group to remove, or its id, or the data representing it.

string | Node | Group | ObjectData

Returns

Group


removeFromSelection()

removeFromSelection(obj): void

Removes obj from the current selection

Parameters

obj

Object to deselect. May be a Node/Edge/Group/Port or an array of any of these, or a Vertex id, or a Path.

string | Base | Base[] | Path

Returns

void


removeGroup()

removeGroup(group, removeChildren?, doNotFireEvent?): boolean

Removes the given Group from the dataset.

Parameters

group

Group or ID of Group to remove.

string | Group

removeChildren?

boolean

If true, Nodes/Groups that are members of the Group will also be removed. Defaults to false.

doNotFireEvent?

boolean

If true, a group:removed will not be fired as a result of this operation. Otherwise it will.

Returns

boolean


removeNode()

removeNode(node): boolean

Removes the given Node, which may be passed in as the actual Node object, or its id.

Parameters

node

Either a Node, or its ID.

string | Vertex

Returns

boolean

True if node removed, false if not.


removePort()

removePort(vertexOrId, portId?): boolean

Removes a Port from the dataset, returning true if the port existed and was removed and false otherwise.

Parameters

vertexOrId

If a string is passed in here, it may represent the full ID of some port, ie in "vertex.port" notation, or it may be the ID of the vertex on which the port to be removed resides. If you do not pass a string to this argument you can pass a Port instead, or you can pass the Node/Group on which the port resides (in which case you'll also need to provide a value for portId)

string | Node | Group | Port

portId?

string

Id of the port to remove from the given node. Only required if you did not provide a full port ID, or the Port itself, to vertexOrId.

Returns

boolean


resolveNode()

resolveNode(v): Node | Group

For the given vertex, resolves the node/group it pertains to. If the vertex is already a node/group, it is returned. Otherwise, if it is a port, the parent of the port is returned.

Parameters

v

Vertex

Returns

Node | Group


rollbackTransaction()

rollbackTransaction(): void

Rolls back the current transaction, undoing any changes to the data model made in the transaction. If there is no current transaction this method does nothing.

Returns

void

Implementation of

WriteableDatasource.rollbackTransaction


save()

save(params): VisuallyJsModel

Saves data via ajax POST to a given URL. By default this method sends the return value of #exportData as its payload, but you can provide your own data to save if you wish.

Parameters

params

SaveOptions

Save parameters

Returns

VisuallyJsModel


select()

select(obj, includeEdges?): VisuallyJsSelection

Gets an ad-hoc selection

Parameters

obj

Object to select. May be a Node/Group/Port/Edge or an array of any one of these, or a Vertex id, a Selection, or a Path.

string | string[] | Base | VisuallyJsSelection | Base[] | Path

includeEdges?

boolean

If true, include edges between vertices

Returns

VisuallyJsSelection


selectAllEdges()

selectAllEdges(): VisuallyJsSelection

Gets all edges in the model as a VisuallyJsSelection.

Returns

VisuallyJsSelection


selectDescendants()

selectDescendants(obj, includeFocus?, includeEdges?): VisuallyJsSelection

Selects all descendants of some Node or Group, and, optionally, the Node/Group itself.

Parameters

obj

Node/Group, or ID of Node/Group, to select

string | Node | Group

includeFocus?

boolean

Whether or not to include the focus node/group in the returned dataset. Defaults to false.

includeEdges?

boolean

Whether or not to include edges in the returned dataset. Defaults to false.

Returns

VisuallyJsSelection

Graph Query


setAutoSave()

setAutoSave(autoSaveOptions): void

Sets options for the auto save mechanism.

Parameters

autoSaveOptions

AutoSaveOptions

Returns

void


setMaxSelectedEdges()

setMaxSelectedEdges(maxEdges): void

Sets the maximum number of edges that may be selected at any one time. Default is Infinity.

Parameters

maxEdges

number

Max number of edges allowed to be selected at once.

Returns

void


setMaxSelectedNodes()

setMaxSelectedNodes(maxNodes): void

Sets the maximum number of nodes that may be selected at any one time. Default is Infinity.

Parameters

maxNodes

number

Max number of nodes allowed to be selected at once.

Returns

void


setSelection()

setSelection(obj): void

Sets obj as the current selection for this model.

Parameters

obj

Object to select. May be a Node/Edge/Group or an array of any of these, or a Node/Group id, or a Path.

string | Base | Base[] | Path

Returns

void


setSelectionCapacityPolicy()

setSelectionCapacityPolicy(policy): void

Sets The action taken when appending an edge or node that would take the selection above its limit for that given type. Depends on the current capacityPolicy, which can be either Selection.DISCARD_EXISTING (the default) or Selection.DISCARD_NEW.

Parameters

policy

string

One of Selection.DISCARD_EXISTING (which removes the 0th entry from the list before insertion of the new value) or Selection.DISCARD_NEW.

Returns

void


setSource()

setSource(edge, o): any

Sets the source for the given edge to be the given vertex.

Parameters

edge

Edge

Edge to set source for.

o

ID of vertex, or vertex.

string | PointXY | Vertex

Returns

any


setSuspendRendering()

setSuspendRendering(v, thenRefresh?): void

Suspends or re-enables rendering. This method simply round-robins all the registered renderers and calls setSuspendRendering on each of them.

Parameters

v

boolean

True to suspend rendering, false to enable it.

thenRefresh?

boolean

Defaults to false. If true, a refresh will be called on all renderers after rendering is unsuspended.

Returns

void


setTarget()

setTarget(edge, o): any

Sets the target for the given edge to be the given vertex.

Parameters

edge

Edge

Edge to set target for.

o

ID of vertex, or vertex.

string | PointXY | Vertex

Returns

any


setType()

setType(obj, newType): void

Sets the type of the given object. This will do two things - first it will update the appropriate property in the object's data to this new value. You can set what properties define types, but by default each of Node, Edge and Port use type as the property that indicates their type. Secondly, this method will attempt to apply a type definition for the new type, if one is found.

Parameters

obj

Base

Object to set the type for.

newType

string

Type to set on the object.

Returns

void


toggleSelection()

toggleSelection(obj): void

Toggles whether or not the given obj forms part of the current selection.

Parameters

obj

Object to select. May be a Node/Group/Port/Edge or an array of any of these, or a Vertex id, or a Path.

string | Base | Base[] | Path

Returns

void


toJSON()

toJSON(): any

Helper method to allow JSON.stringify to be called with an instance of VisuallyJs as argument (JSON.stringify looks for a toJSON() method on each object it is attempting to serialise). This method generates the same output as calling exportData().

Returns

any


transaction()

transaction(fn, cleanupAction?): string | false

Opens a transaction and runs the given function within it, then commits the transaction. If your function returns false (boolean false, not false-y), the transaction is rolled back instead of committed.

Parameters

fn

() => any

Function to run.

cleanupAction?

TransactionCleanupAction

What to do if a transaction already exists.

Returns

string | false

A string providing the transaction's ID, null if no transaction was created.


unbind()

unbind(eventOrListener?, listener?): EventGenerator

Unbind the given event listener, or all listeners. If you call this method with no arguments then all event listeners are unbound.

Parameters

eventOrListener?

Either an event name, or an event handler function

string | Function

listener?

Function

If eventOrListener is defined, this is the event handler to unbind.

Returns

EventGenerator

Implementation of

WriteableDatasource.unbind

Inherited from

OptimisticEventGenerator.unbind


undo()

undo(): void

Undo the latest operation, if there is one. Otherwise does nothing.

Returns

void


update()

update(object, updates?): void

Updates the given object, notifying any renderers to do a repaint.

Parameters

object

Base

Either a Node, Group, Port or Edge, or, as a string, the id of some Node, Group, Port or Edge.

updates?

ObjectData

An object with path->value pairs. Path can be in dotted notation. You do not actually have to supply this, although in most cases you will want to. But there are edge cases in which you might simply wish to kick off a repaint.

Returns

void


updateEdge()

updateEdge(obj, updates?): void

Updates the given Edge, notifying any Renderers to do a redraw. If autoSave is set, this method will cause the dataset to be saved.

Parameters

obj

Either an Edge, an Edge id, or the backing data for an Edge.

string | Edge

updates?

ObjectData

An object with path->value pairs. Path can be in dotted notation. You do not actually have to supply this, although in most cases you will want to. But there are edge cases in which you might simply wish to kick off a repaint.

Returns

void


updateGroup()

updateGroup(group, updates?): void

Updates the given Group, notifying any Renderers to do a redraw. If autoSave is set, this method will cause the dataset to be saved.

Parameters

group

Either a Group, a Group id, or the backing data for a Group.

string | Group | ObjectData

updates?

ObjectData

An object with path->value pairs. Path can be in dotted notation. You do not actually have to supply this, although in most cases you will want to. But there are edge cases in which you might simply wish to kick off a repaint.

Returns

void


updateNode()

updateNode(node, updates?): void

Updates the given Node, notifying any Renderers to do a redraw. If autoSave is set, this method will cause the dataset to be saved.

Parameters

node

Either a Node, a Node id, or the backing data for a Node.

string | Node | ObjectData

updates?

ObjectData

An object with path->value pairs. Path can be in dotted notation. You do not actually have to supply this, although in most cases you will want to. But there are edge cases in which you might simply wish to kick off a repaint.

Returns

void


updatePort()

updatePort(port, updates?): void

Updates the given Port, notifying any Renderers to do a redraw. If autoSave is set, this method will cause the dataset to be saved.

Parameters

port

Either a Port, or a full Port id

string | Port

updates?

ObjectData

An object with path->value pairs. Path can be in dotted notation. You do not actually have to supply this, although in most cases you will want to. But there are edge cases in which you might simply wish to kick off a repaint.

Returns

void


updateVertex()

updateVertex(vertex, updates?): void

Updates the given Node/Group, notifying any Renderers to do a redraw. If autoSave is set, this method will cause the dataset to be saved.

Parameters

vertex

Either a Node/Group, a Node/Group id, or the backing data for a Node/Group.

string | Node | Group | Port | ObjectData

updates?

ObjectData

An object with path->value pairs. Path can be in dotted notation. You do not actually have to supply this, although in most cases you will want to. But there are edge cases in which you might simply wish to kick off a repaint.

Returns

void

Implementation of

WriteableDatasource.updateVertex


updateVertices()

updateVertices(updates, cleanupAction?): void

Updates the given list of vertices. This method runs in a transaction, by default appending itself to any current transaction (as updating a list of vertices is the common end result of various operations on the data model), but you can provide your own cleanup action if desired.

Parameters

updates

object[]

cleanupAction?

TransactionCleanupAction

Returns

void

Implementation of

WriteableDatasource.updateVertices