GoJS API
/ to search
    Preparing search index...

    Class GraphLinksModel<NodeDataType, LinkDataType, SharedDataType>

    GraphLinksModels support links between nodes and grouping nodes and links into subgraphs. GraphLinksModels hold node data and link data in separate arrays. Node data is normally represented in a Diagram by instances of Node, but they could be represented by simple Parts or by Groups. Link data should be represented by instances of Link.

    Each link data object is assumed to have two values, one referring to the node that the link is coming from and one that the link is going to. The linkFromKeyProperty property names the property on the link data whose value is the key of the "from" node. The linkToKeyProperty property names the property on the link data whose value is the key of the "to" node. The default values for these properties are "from" and "to" respectively.

    For example, one can define a graph consisting of two nodes with one link connecting them:

     model.nodeDataArray = [
    { key: "Alpha" },
    { key: "Beta" }
    ];
    model.linkDataArray = [
    { from: "Alpha", to: "Beta" }
    ];

    If you want to have subgraphs in your diagram, where a group node contains some number of nodes and links, you need to declare that some node data actually represent groups, and you need to provide a reference from a member node data to its containing group node data. The nodeIsGroupProperty property names the property on a node data that is true if that node data represents a group. The nodeGroupKeyProperty property names the property on a node data whose value is the key of the containing group's node data. The default values for these properties are "isGroup" and "group" respectively.

    For example, one can define a graph consisting of one group containing a subgraph of two nodes connected by a link, with a second link from that group to a third node that is not a member of that group:

     model.nodeDataArray = [
    { key: "Group1", isGroup: true},
    { key: "Alpha", group: "Group1" },
    { key: "Beta", group: "Group1" },
    { key: "Gamma" }
    ];
    model.linkDataArray = [
    { from: "Alpha", to: "Beta" },
    { from: "Group1", to: "Gamma" }
    ];

    GraphLinksModels also support distinguishing the "port" element of a node to which a link can connect, at either end of the link. This identification is a string that names the "port" element in the node. However, you need to set the linkFromPortIdProperty and/or linkToPortIdProperty properties before the model is able to get the "port id" information from the link data.

    For example, one can define a graph consisting of a "subtraction" node and two inputs and one output. The "subtraction" node has two distinct inputs called "subtrahend" and "minuend"; the output is called "difference".

     model.linkFromPortIdProperty = "fromPort";  // necessary to remember portIds
    model.linkToPortIdProperty = "toPort";
    model.nodeDataArray = [
    { key: 1, constant: 5 }, // a constant input node
    { key: 2, constant: 2 }, // another constant node
    { key: 3, operation: "subtract" },
    { key: 4, value: 3 } // the output node
    ];
    model.linkDataArray = [
    { from: 1, to: 3, toPort: "subtrahend" },
    { from: 2, to: 3, toPort: "minuend" },
    { from: 3, to: 4, fromPort: "difference" }
    ];

    In this case links connected to node 3 (which is the subtraction operation) are distinguished by port id. The connections to the other nodes do not have any port identification, presumably because there is only one port on those nodes, representing the node value.

    Note that there is no requirement that the link data objects have any kind of unique identifier, unlike for node data. There is no expectation that there be references to link data in the model, so there is no need for such an identifier. When there are multiple links connecting two ports, the only way to distinguish the links in the model is by reference to the particular link data object. This is why there are two methods on the Diagram class for Nodes, Diagram.findNodeForKey and Diagram.findNodeForData, but there is only the one method for Links, Diagram.findLinkForData.

    However you may wish to have the model maintain string or number identifiers on the link data just as all models do for node data. To get that behavior, so that you can call findLinkDataForKey, you need to set linkKeyProperty to be a non-empty string. Just as with the assignment of node keys, you can customize the assignment of link keys by setting makeUniqueLinkKeyFunction to a function that returns a unique identifier.

    This model does not support the modification of whether a node data object is a group.

    This model cannot detect the modification of the linkDataArray array or the modification of any link data object. If you want to add or remove link data from the linkDataArray, call the addLinkData or removeLinkData methods. If you want to modify the node a link connects to, call the setFromKeyForLinkData and/or setToKeyForLinkData methods. If you want to change the membership of a node data in a group, call the setGroupKeyForNodeData method.

    Type Parameters

    Hierarchy (View Summary)

    Index

    Constructors

    Accessors

    Methods

    Constructors

    Accessors

    • get archetypeNodeData(): NodeDataType | null

      Gets or sets a data object that will be copied and added to the model as a new node data each time there is a link reference (either the "to" or the "from" of a link data) to a node key that does not yet exist in the model.

      The default value is null -- node data is not automatically copied and added to the model when there is an unresolved reference in a link data. When adding or modifying a link data if there is a "from" or "to" key value for which Model.findNodeDataForKey returns null, it will call Model.copyNodeData on this property value and Model.addNodeData on the result.

      Returns NodeDataType | null

    • get copiesArrayObjects(): boolean

      Gets or sets whether the default behavior for copyNodeData or GraphLinksModel.copyLinkData when copying Arrays also copies array items that are Objects. This only covers copying Objects that are items in Arrays that are copied when copiesArrays is true. Copying an Object when this property is true also recursively copies any Arrays that are property values. It also assumes that the object's constructor can be called with no arguments.

      The default value is false. This property does not affect any behavior when the value of copyNodeDataFunction or GraphLinksModel.copyLinkDataFunction has been set to a function. This property has no effect unless copiesArrays is true.

      Caution: if you want a copied data object to share some references but not others, you will need to provide your own copying function as copyNodeDataFunction rather than setting this property and copiesArrays to true.

      Warning: there should not be any cyclical references within the model data.

      Returns boolean

    • get copiesArrays(): boolean

      Gets or sets whether the default behavior for copyNodeData or GraphLinksModel.copyLinkData makes copies of property values that are Arrays. This only copies Arrays that are top-level property values in data objects, not for Arrays that are in nested objects. Copying Arrays will also copy any array items that are Objects when copiesArrayObjects is true.

      The default value is false. It is commonplace to set copiesArrayObjects to true when setting this property to true. This property does not affect any behavior when the value of copyNodeDataFunction or GraphLinksModel.copyLinkDataFunction has been set to a function.

      Caution: if you want a copied data object to share some Arrays but not others, you will need to provide your own copying function as copyNodeDataFunction rather than setting this property to true.

      Warning: there should not be any cyclical references within the model data.

      Returns boolean

    • get copiesKey(): boolean

      Gets or sets whether the default behavior for copyNodeData or GraphLinksModel.copyLinkData when copying properties of a data object also copies the key property value. Set this to false in order to force a unique key generation for data copied from another Diagram, such as a Palette. Set this to true in order to keep the same key as the source data object, unless it is not unique in the target model. You may need to set it to true on both the source model as well as the destination model.

      The default value is false. This property does not affect any behavior when the value of copyNodeDataFunction has been set to a function.

      Returns boolean

    • get copyNodeDataFunction(): ((data: NodeDataType, model: Model<NodeDataType>) => NodeDataType) | null

      Gets or sets a function that makes a copy of a node data object.

      You may need to set this property in order to ensure that a copied Node is bound to data that does not share certain data structures between the original node data and the copied node data. This property value may be null in order to cause copyNodeData to make a shallow copy of a JavaScript Object. The default value is null.

      The first argument to the function will be a node data object (potentially a Part's Panel.data). The second argument to the function will be this Model itself.

      It is common to implement a copying function when the node data has an Array of data and that Array needs to be copied rather than shared. Often the objects that are in the Array also need to be copied.

      Returns ((data: NodeDataType, model: Model<NodeDataType>) => NodeDataType) | null

    • get dataFormat(): string

      Gets or sets the name of the format of the diagram data. The default value is the empty string. The value must not be null. Use different values to prevent parts from one model to be copy/pasted or drag-and-dropped into another diagram/model.

      Returns string

    • get isReadOnly(): boolean

      Gets or sets whether this model may be modified, such as adding nodes. By default this value is false. Setting the nodeDataArray to something that is not a true Array of Objects will cause this to be set to true.

      Model methods and property setters do not heed this property. It is up to code that uses a model to check this property when it might want to prevent changes to the model.

      Returns boolean

    • get linkCategoryProperty(): string | ((a: LinkDataType, b?: string) => string)

      Gets or sets the name of the data property that returns a string naming that data's category, The value may also be a function taking two arguments, where the first argument will be a link data object. If the second argument is not supplied, the function should return the category name; if the second argument is supplied, the function should modify the link data object so that it has that new category name. The default value is the name 'category', meaning that it expects the data to have a property named 'category' if it cares to name the category for the Link. This is used by the diagram to distinguish between different kinds of links. The name must not be null. If the value is an empty string, getCategoryForLinkData will return an empty string for all link data objects.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: LinkDataType, b?: string) => string)

    • get linkDataArray(): LinkDataType[]

      Gets or sets the array of link data objects that correspond to Links in the Diagram. The initial value is an empty Array.

      Returns LinkDataType[]

    • get linkFromKeyProperty(): string | ((a: LinkDataType, b?: Key) => Key)

      Gets or sets the name of the data property that returns the key of the node data that the link data is coming from. The value may also be a function taking two arguments, where the first argument will be a link data object. If the second argument is not supplied, the function should return the key of the link's source node; if the second argument is supplied, the function should modify the link data object so that it has that new key (which may be undefined to refer to no node) as the identifier to the "from" node. The default value is the name 'from', meaning that it expects the data to have a property named 'from' to refer to the link's source node. The name must not be null. If the value is an empty string, getFromKeyForLinkData will return undefined for all link data objects.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: LinkDataType, b?: Key) => Key)

    • get linkFromPortIdProperty(): string | ((a: LinkDataType, b?: string) => string)

      Gets or sets the name of the data property that returns the optional parameter naming a "port" element on the node that the link data is connected from. The value may also be a function taking two arguments, where the first argument will be a link data object. If the second argument is not supplied, the function should return the string identifier of the link's source port; if the second argument is supplied, the function should modify the link data object so that it has that string as the identifier to the "from" port. The default value is the empty string indicating that one cannot distinguish different logical connection points for any links. The name must not be null nor the value of linkFromKeyProperty or linkToKeyProperty. If the value is an empty string, getFromPortIdForLinkData will return an empty string for all link data objects.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: LinkDataType, b?: string) => string)

    • get linkKeyProperty(): string | ((a: LinkDataType, b?: Key) => Key)

      Gets or sets the name of the data property that returns a unique id number or string for each link data object. The value may also be a function taking two arguments, where the first argument will be a link data object. If the second argument is not supplied, the function should return the unique string or number key for that link data object; if the second argument is supplied, the function should modify the link data object so that it has that string or number as the unique key for that link. The default value is the empty string, which means the model will not maintain a key property value on link data objects. The name must not be null.

      When this property has a value of an empty string (the default value), getKeyForLinkData will return undefined, and findLinkDataForKey will always return null.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: LinkDataType, b?: Key) => Key)

    • get linkLabelKeysProperty(): string | ((a: LinkDataType, b?: Key[]) => Key[])

      Gets or sets the name of the data property that returns an array of keys of node data that are labels on that link data. The value may also be a function taking two arguments, where the first argument will be a link data object. If the second argument is not supplied, the function should return the array of label node keys for the link; if the second argument is supplied, the function should modify the link data object so that it holds that Array of node keys as references to label nodes. The default value is the empty string: '', meaning that the model does not support links owning label nodes.

      The name must not be null. If the value is an empty string, getLabelKeysForLinkData will return an empty array for all link data objects. You will need to set this property in order to support nodes as link labels.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: LinkDataType, b?: Key[]) => Key[])

    • get linkToKeyProperty(): string | ((a: LinkDataType, b?: Key) => Key)

      Gets or sets the name of the data property that returns the key of the node data that the link data is going to, The value may also be a function taking two arguments, where the first argument will be a link data object. If the second argument is not supplied, the function should return the key of the link's destination node; if the second argument is supplied, the function should modify the link data object so that it has that new key (which may be undefined to refer to no node) as the identifier to the "to" node. The default value is the name 'to', meaning that it expects the data to have a property named 'to' to refer to the link's destination node. The name must not be null. If the value is an empty string, getToKeyForLinkData will return undefined for all link data objects.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: LinkDataType, b?: Key) => Key)

    • get linkToPortIdProperty(): string | ((a: LinkDataType, b?: string) => string)

      Gets or sets the name of the data property that returns the optional parameter naming a "port" element on the node that the link data is connected to. The value may also be a function taking two arguments, where the first argument will be a link data object. If the second argument is not supplied, the function should return the string identifier of the link's destination port; if the second argument is supplied, the function should modify the link data object so that it has that string as the identifier to the "to" port. The default value is the empty string indicating that one cannot distinguish different logical connection points for any links. The name must not be null nor the value of linkFromKeyProperty or linkToKeyProperty. If the value is an empty string, getToPortIdForLinkData will return an empty string for all link data objects.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: LinkDataType, b?: string) => string)

    • get makeUniqueKeyFunction(): ((model: Model<NodeDataType>, data: NodeDataType) => Key) | null

      Gets or sets a function that returns a unique id number or string for a node data object. This function is called by makeNodeDataKeyUnique when a node data object is added to the model, either as part of a new nodeDataArray or by a call to addNodeData, to make sure the value of getKeyForNodeData is unique within the model.

      The value may be null in order to cause makeNodeDataKeyUnique behave in the standard manner. (The default value is null.) You may want to supply a function here in order to make sure all of the automatically generated keys are in a particular format. Setting this property after setting nodeDataArray has no real effect until there is a call to addNodeData.

      A simple example:

      const model = go.Model.fromJson(str);
      model.makeUniqueKeyFunction = (model, data) => crypto.randomUUID();
      myDiagram.model = model;

      If you want to ensure that this function is called when copying data that already has a key, make sure copiesKey is false, which is its default value in version 3. This is typically useful when copying a node from a Palette, where the key it has in the Palette's Model happens to be unique within the target Diagram's Model. If you set copiesKey to true on the target Diagram's model, the original key value will be copied and retained if it is already unique within the target model.

      If a node data object is already in the model and you want to change its key value, call setKeyForNodeData with a new and unique key.

      Returns ((model: Model<NodeDataType>, data: NodeDataType) => Key) | null

    • get modelData(): SharedDataType

      Gets or sets a JavaScript Object that can hold programmer-defined property values for the model as a whole, rather than just for one node or one link.

      By default this an object with no properties. Any properties that you add to this object will be written out by toJson and will be restored by Model.fromJson, if the following conditions are true:

      • the property is enumerable and its name does not start with an underscore ('_')
      • the property value is not undefined and is not a function
      • the model knows how to convert the property value to JSON format
      • property values that are Objects or Arrays form a tree structure -- no shared or cyclical references

      The new value must not be null.

      This data object must not be used in the nodeDataArray or GraphLinksModel.linkDataArray or in any Panel.itemArray.

      Most object classes cannot be serialized into JSON without special knowledge and processing at both ends. The toJson and Model.fromJson methods automatically do such processing for numbers that are NaN and for objects that are of class Point, Size, Rect, Margin, Spot, Brush (but not for brush patterns), and for Geometry.

      At the current time one cannot have a Diagram as a binding target. Calling set will work to change a property value, but there are no target bindings in any Diagrams to be updated. Because the binding mechanism is unavailable for this object, we recommend that when you want to save a model that you explicitly set properties on this object just before calling toJson. When loading a model, call Model.fromJson and explicitly get the properties that you want to set on a Diagram.

      Returns SharedDataType

    • get name(): string

      Gets or sets the name of this model. The initial name is an empty string. The value must not be null.

      Returns string

    • get nodeCategoryProperty(): string | ((a: NodeDataType, b?: string) => string)

      Gets or sets the name of the node data property that returns a string naming that data's category. The value may also be a function taking two arguments, where the first argument will be a node data object. If the second argument is not supplied, the function should return the category name; if the second argument is supplied, the function should modify the node data object so that it has that new category name. The default value is the string 'category', meaning that it expects the data to have a property named 'category' if it cares to name a category. This is used by the diagram to distinguish between different kinds of nodes. The name must not be null. If the value is an empty string, getCategoryForNodeData will return an empty string for all node data objects.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: NodeDataType, b?: string) => string)

    • get nodeDataArray(): NodeDataType[]

      Gets or sets the array of node data objects that correspond to Nodes, Groups, or non-Link Parts in the Diagram. The initial value is an empty Array.

      For each Object in the Array, getKeyForNodeData should return a number or string uniquely identifying the node data within the model. If it returns undefined, this calls makeNodeDataKeyUnique, to make sure the node data has a unique key. These key values may be used by other objects to refer to that particular node data object. If more than one node data object has the same key, there may be some confusion about which object to reference.

      If you want to use a custom data property for holding the unique key value on a node data object, you should set nodeKeyProperty before you set this nodeDataArray property.

      Adding or removing data from this Array will not notify this model or the diagram that there are any new nodes or that any nodes have been deleted. Instead you should call addNodeData or removeNodeData.

      Returns NodeDataType[]

    • get nodeGroupKeyProperty(): string | ((a: NodeDataType, b?: Key) => Key)

      Gets or sets the name of the property on node data that specifies the string or number key of the group data that "owns" that node data. The value may also be a function taking two arguments, where the first argument will be a node data object. If the second argument is not supplied, the function should return the string or number key for the group data object of which the given data object is a member; if the second argument is supplied, the function should modify the node data object so that it has that new key (which may be undefined to refer to no node) as the containing group key for that node. The default value is the name 'group', meaning that it expects the data to have a property named 'group' to refer to any containing group.

      The value must not be null. If the value is an empty string, getGroupKeyForNodeData will return undefined for all node data objects.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: NodeDataType, b?: Key) => Key)

    • get nodeIsGroupProperty(): string | ((a: NodeDataType, b?: boolean) => boolean)

      Gets or sets the name of the boolean property on node data that indicates whether the data should be represented as a group of nodes and links or as a simple node. The value may also be a function taking two arguments, where the first argument will be a node data object. If the second argument is not supplied, the function should return true if the node data object should be represented by a Group and false otherwise. At the current time the function will not be called to change whether the node is a group or not. The default value is the name 'isGroup', meaning that it expects the data to have a property named 'isGroup' on those node data objects that should be represented by Groups.

      The value must not be null. If the value is an empty string, isGroupForNodeData will return false for all node data objects.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: NodeDataType, b?: boolean) => boolean)

    • get nodeKeyProperty(): string | ((a: NodeDataType, b?: Key) => Key)

      Gets or sets the name of the data property that returns a unique id number or string for each node data object. The value may also be a function taking two arguments, where the first argument will be a node data object. If the second argument is not supplied, the function should return the unique key value; if the second argument is supplied, the function should modify the node data object so that it has that new value as its unique key value. The default value is the name 'key', meaning that it expects the data to have a property named 'key' if it has a key value. The name must not be null or the empty string. You must set this property before assigning the nodeDataArray.

      If you want to set this property you must do so before using the model, and especially before you assign Diagram.model. Note that functions cannot be serialized into JSON-formatted text, so if you are using toJson and Model.fromJson, and if you want this property to be a function, you will need to assign this property to your desired function immediately after creating the model, including when it is created by Model.fromJson.

      Returns string | ((a: NodeDataType, b?: Key) => Key)

    • get pointsDigits(): number

      Gets or sets the number of digits after the decimal point for 'points' values written out in an Array for the Link.points property.

      A new value must be a non-negative integer less than or equal to 100; typically the value will be 1, 2, or 3. A value of zero is not recommended.

      The default value is 100. Values larger than 16 will cause each number to be written out with however many decimal digits are needed without trailing zeros.

      Returns number

    • get skipsUndoManager(): boolean

      Gets or sets whether ChangedEvents are not recorded by the UndoManager. The initial and normal value is false. WARNING: while this property is true do not perform any changes that cause any previous transactions to become impossible to undo.

      When this property is true, changing the Model or any data object does not call UndoManager.handleChanged. Even when this property is true, transactions (such as calls to startTransaction) and undo/redo (such as calls to CommandHandler.undo) are still delegated to the undoManager.

      You should set this to true only temporarily, and you should remember its previous value before setting this to true. When finishing the period for which you want the UndoManager to be disabled, do not blindly set this property to false. You should set this back to the value it had before you set it to true. For more permanent disabling of the UndoManager, set UndoManager.isEnabled to false.

      This property is also set when setting Diagram.skipsUndoManager. Note that setting skipsUndoManager to true for a nested transaction will prevent model changes from being recorded, but if Diagram.skipsUndoManager is still false during an outer transaction, any Diagram changes will still be recorded. Setting this property does not raise a ChangedEvent.

      Returns boolean

    • get undoManager(): UndoManager

      Gets or sets the UndoManager for this Model.

      The default UndoManager has its UndoManager.isEnabled property set to false. If you want users to undo and redo, you should set that property to true once you have initialized the Diagram or its Model.

      This property setter does not raise a ChangedEvent.

      Returns UndoManager

    Methods

    • When you want to add a link to the diagram, call this method with a new data object. This will add that data to the linkDataArray and notify all listeners that a new link data object has been inserted into the collection.

      Presumably the link data object will already have its "from" and "to" node key references set, but it is also possible to set them after the link data is in the model by calling setFromKeyForLinkData and setToKeyForLinkData.

      This operation does nothing if the link data is already part of this model's linkDataArray.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      Returns void

    • When you want to add a node or group to the diagram, call this method with a new data object. This will add that data to the nodeDataArray and notify all listeners that a new node data object has been inserted into the collection.

      To remove a node from the diagram, you can remove its data object by calling removeNodeData.

      To add or remove an object or value from an item array, call insertArrayItem or removeArrayItem.

      Parameters

      • nodedata: NodeDataType

        a JavaScript object represented by a node, group, or non-link.

      Returns void

    • Modify this model by applying the changes given in an "incremental" model change in JSON format generated by toIncrementalJson. The expected properties of the argument are described at toIncrementalJson. Incremental changes must be applied in the same order that the changes occurred in the original model.

      This requires the "incremental" property to be present and to be a number, as specified by toIncrementalJson. All of the top-level properties in the JSON, such as nodeKeyProperty, must be the same as for this model. Note that if the model is a GraphLinksModel, you will have to have set GraphLinksModel.linkKeyProperty to the name of a property, the same both in the Diagram.model as well as in the data that you pass to this method.

      This conducts a transaction.

      Parameters

      • s: string | ObjectData

        a String in JSON format containing modifications to be performed to the model, or a JavaScript Object parsed from such a string

      Returns void

    • Deeply copy an object or array and return the new object. This is typically called on a nodeDataArray or GraphLinksModel.linkDataArray or data objects within them.

      By default, this method will make deep clones of arrays and JavaScript objects and maintain any shared or cyclic references. It will properly copy any Date or RegExp object, and will call a copy function on any object where one exists. It also handles certain GoJS classes: Point, Size, Rect, Margin, Spot, List, Set, and Map. It will not handle instances of Diagram, Layer, GraphObject, Tool, CommandHandler, AnimationManager or subclasses or related classes.

      This method may be overridden. Please read the Learn page on Extensions for how to override methods and how to call this base method. Only override this method when the default behavior doesn't suit the data.

      Type Parameters

      • T

      Parameters

      • obj: T

      Returns T

      since

      2.1

    • Starts a new transaction, calls the provided function, and commits the transaction. Code is called within a try-finally loop. If the function does not return normally, this rolls back the transaction rather than committing it. Example usage:

      model.commit(m => m.addNodeData({ counter: myCounter++ }), "Added Node");
      

      Note that setting skipsUndoManager to true for a nested transaction will prevent model changes from being recorded, but if Diagram.skipsUndoManager is still false during an outer transaction, any Diagram changes will still be recorded.

      Parameters

      • func: (m: Model<NodeDataType>) => void

        the function to call as the transaction body

      • Optionaltname: string | null

        a descriptive name for the transaction, or null to temporarily set skipsUndoManager to true; if no string transaction name is given, an empty string is used as the transaction name

      Returns void

    • Decide if a given link data object is in this model, using reference equality.

      If you do not have a reference to the particular data object that is in the linkDataArray, you may need to search for it by iterating through that Array, or (more likely), by finding the desired Link in a Diagram and getting that link's Panel.data.

      Note that because link data are not assumed to be have a unique key property they cannot be found using an index that this model would maintain. However you may choose to provide such a property on the link data objects and maintain your own index.

      Parameters

      • linkdata: LinkDataType | null

        a JavaScript object represented by a link; if null, this predicate will return false

      Returns boolean

    • Decide if a given node data object is in this model, using reference equality.

      If you do not have a reference to the particular data object that is in the nodeDataArray, you may need to search for it by iterating through that Array, or by finding the desired Node or simple Part in a Diagram and getting that node's Panel.data, or most likely by calling findNodeDataForKey.

      Parameters

      • nodedata: NodeDataType | null

        a JavaScript object represented by a node, group, or non-link; if null, this predicate will return false

      Returns boolean

      true if it is a node data object in this model; false otherwise.

    • Make a copy of a link data object. This uses the value of copyLinkDataFunction to actually perform the copy, unless it is null, in which case this method just makes a shallow copy of the JavaScript Object.

      This does not modify the model -- the returned data object is not added to this model. This assumes that the data's constructor can be called with no arguments. This also makes sure there is no reference to either the "from" or the "to" node of the original data.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      Returns LinkDataType

    • Given a number or string, find the link data object in this model that uses the given value as its unique key.

      Unless linkKeyProperty is set to a non-empty string, this model will not automatically assign unique key values for link data objects, and thus this method will always return null.

      Parameters

      • key: Key

        a string or a number.

      Returns LinkDataType | null

      null if the key is not present in the model, or if the key is null or undefined or not a string or number.

    • From a link data retrieve a value uniquely identifying the node data from which this link is connected.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      Returns Key

      This may return undefined if the link is not coming from any node.

    • From a link data retrieve a value identifying the port object of the node from which this link is connected.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      Returns string

      This may return the empty string if there is no particular port parameter information.

    • From a link data retrieve a value uniquely identifying the node data to which this link is connected.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      Returns Key

      This may return undefined if the link is not going to any node.

    • From a link data retrieve a value identifying the port object of the node to which this link is connected.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      Returns string

      This may return the empty string if there is no particular port parameter information.

    • Add an item to a data array that may be data bound by a Panel as its Panel.itemArray, given a new data value and the index at which to insert the new value, in a manner that can be undone/redone and that automatically updates any bindings.

      This also calls raiseChangedEvent to notify all listeners about the ChangeType.Insert.

      If you want to add a new node or part to the diagram, call addNodeData.

      Parameters

      • arr: any[]

        an Array that is the value of some Panel's Panel.itemArray.

      • idx: number

        the zero-based array index where the new value will be inserted; use -1 to push the new value on the end of the array.

      • val: any

        the new value to be inserted into the array.

      Returns void

    • See if the given node data should be represented as a group or as a simple node.

      This value must not change as long as the node data is part of the model. At the current time there is no setIsGroupForNodeData method.

      Parameters

      • nodedata: NodeDataType

        a JavaScript object represented by a node, group, or non-link.

      Returns boolean

    • This method is called when a link data object is added to the model to make sure that getKeyForLinkData returns a unique key value.

      The key value should be unique within the set of data managed by this model: linkDataArray. If the key is already in use, this will assign an unused number to the linkKeyProperty property on the data.

      If you want to customize the way in which link data gets a unique key, you can set the makeUniqueKeyFunction functional property.

      If the link data object is already in the model and you want to change its key value, call setKeyForLinkData and give it a new unique key value.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link

      Returns void

    • This method is called when a node data object is added to the model to make sure that getKeyForNodeData returns a unique key value.

      The key value should be unique within the set of data managed by this model: nodeDataArray. If the key is already in use, this will assign an unused number to the nodeKeyProperty property on the data.

      If you want to customize the way in which node data gets a unique key, you can set the makeUniqueKeyFunction functional property.

      If the node data object is already in the model and you want to change its key value, call setKeyForNodeData and give it a new unique key value.

      Parameters

      • nodedata: NodeDataType

        a JavaScript object represented by a node, group, or non-link.

      Returns void

    • Take an Array of link data objects and update linkDataArray without replacing the Array and without replacing any existing link data objects that are identified by key. This depends on linkKeyProperty being a non-empty string.

      For link data objects that have the same key value, this makes calls to set to update the existing link data object. For new keys, this calls cloneDeep to copy the data and then addLinkData to add a new link to the model. For existing links that have keys that are not present in the given Array, this calls removeLinkData to remove the existing link from the model.

      This method is typically used when GoJS is being used within an application that is maintaining state related to the diagram model. When state is updated, this method can be called to keep the GoJS model synchronized. Any updates to the data should use new references since this method will use reference equality to check if a link data object needs to be updated.

      This method does not conduct a transaction.

      Parameters

      Returns void

      since

      2.1

    • Take an Array of node data objects and update nodeDataArray without replacing the Array and without replacing any existing node data objects that are identified by key.

      For node data objects that have the same key value, this makes calls to set to update the existing node data object. For new keys, this calls cloneDeep to copy the data and then addNodeData to add a new node to the model. For existing nodes that have keys that are not present in the given Array, this calls removeNodeData to remove the existing node from the model.

      This method is typically used when GoJS is being used within an application that is maintaining state related to the diagram model. When state is updated, this method can be called to keep the GoJS model synchronized. Any updates to the data should use new references since this method will use reference equality to check if a node data object needs to be updated.

      This method does not conduct a transaction.

      Parameters

      Returns void

      since

      2.1

    • Call this method to notify that the model or its objects have changed. This constructs a ChangedEvent and calls all Changed listeners.

      Parameters

      • change: ChangeType

        specifies the general nature of the change; typically the value is ChangeType.Property.

      • propertyname: string | ((obj: any, val: any) => any)

        names the property that was modified, or a function that takes an Object and returns the property value.

      • obj: ObjectData

        the object that was modified, typically a GraphObject, Diagram, or a Model.

      • oldval: any

        the previous or older value.

      • newval: any

        the next or newer value.

      • Optionaloldparam: any

        an optional value that helps describe the older value.

      • Optionalnewparam: any

        an optional value that helps describe the newer value.

      Returns void

    • Call this method to notify about a data property having changed value. This constructs a ChangedEvent and calls all Changed listeners.

      You should call this method only if the property value actually changed. This method is called by set.

      Parameters

      • data: ObjectData

        the data object whose property changed value.

      • propertyname: string | ((obj: any, val: any) => any)

        the name of the property, or a function that takes an Object and returns the property value.

      • oldval: any

        the previous or old value for the property.

      • newval: any

        the next or new value for the property.

      • Optionaloldparam: any

        an optional value additionally describing the old value.

      • Optionalnewparam: any

        an optional value additionally describing the new value.

      Returns void

    • Remove an item from a data array that may be data bound by a Panel as its Panel.itemArray, given the index at which to remove a data value, in a manner that can be undone/redone and that automatically updates any bindings.

      This also calls raiseChangedEvent to notify all listeners about the ChangeType.Remove.

      If you want to remove a node from the diagram, call removeNodeData.

      Note that there is no version of this method that takes an item value instead of an index into the array. Because item arrays may hold any JavaScript value, including numbers and strings, there may be duplicate entries with that value in the array. To avoid ambiguity, removing an item from an array requires an index.

      Parameters

      • arr: any[]

        an Array that is the value of some Panel's Panel.itemArray.

      • Optionalidx: number

        the zero-based array index of the data item to be removed from the array; if not supplied it will remove the last item of the array.

      Returns void

    • Removes a node key value that identifies a node data acting as a former label node on the given link data.

      Removing a reference to a node data from the collection of link label keys does not automatically remove any node data from the model.

      This method only works if linkLabelKeysProperty has been set to something other than an empty string.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      • key: Key

        a number or string that is the key of the label node being removed from the link.

      Returns void

    • When you want to remove a link from the diagram, call this method with an existing link data object. This will remove that data object from the linkDataArray and notify all listeners that a link data object has been removed from the collection.

      If you do not have a reference to the particular data object that is in the linkDataArray, you may need to search for it by iterating through that Array, or (more likely), by finding the desired Link in a Diagram and getting that link's Panel.data.

      Removing a link data from a model does not automatically remove any associated label node data from the model.

      This operation does nothing if the link data is not present in the linkDataArray.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      Returns void

    • When you want to remove a node or group from the diagram, call this method with an existing data object. This will remove that data from the nodeDataArray and notify all listeners that a node data object has been removed from the collection.

      If you do not have a reference to the particular data object that is in the nodeDataArray, you may need to search for it by iterating through that Array, or by finding the desired Node or simple Part in a Diagram and getting that node's Panel.data, or most likely by calling findNodeDataForKey.

      Removing a node data from a model does not automatically remove any connected link data from the model. Removing a node data that represents a group does not automatically remove any member node data or link data from the model.

      To add a node to the diagram, you can add its data object by calling addNodeData.

      To add or remove an object or value from an item array, call insertArrayItem or removeArrayItem.

      Parameters

      • nodedata: NodeDataType

        a JavaScript object represented by a node, group, or non-link.

      Returns void

    • This override changes the value of some property of a node data, a link data, or an item data, given a string naming the property and the new value, in a manner that can be undone/redone and that automatically updates any bindings. This override handles link data as well as node data.

      This gets the old value of the property; if the value is the same as the new value, no side-effects occur.

      Parameters

      • data: ObjectData

        a JavaScript object typically the value of a Panel.data and represented by a Node, Link, Group, simple Part, or item in a Panel.itemArray; or this model's modelData.

      • propname: string

        a string that is not null or the empty string.

      • val: any

        the new value for the property.

      Returns void

    • Change the category of a given link data, a string naming the link template that the Diagram should use to represent the link data.

      Changing the link template for a link data will cause the existing Link to be removed from the Diagram and be replaced with a new Link created by copying the new link template and applying any data-bindings. Note that the new template must be an instance of the same class as the original link. Thus one cannot change the category of a link from an instance of Link to an instance of a subclass of Link, nor vice-versa.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      • cat: string

        Must not be null.

      Returns void

    • Change the category of a given node data, a string naming the node template or group template or part template that the Diagram should use to represent the node data.

      Changing the node template for a node data will cause the existing Node, Group, or Part to be replaced with a new instance of the same class created by copying the new node template and applying any data-bindings. That means that the templates in the Diagram.nodeTemplateMap or Diagram.groupTemplateMap must be instances of the same class -- one cannot convert a Node into a Group or vice-versa by setting the category.

      Binding sources should not be (or depend in a conversion function on) the category of the data if you might be modifying the category, because then some bindings might be evaluated before or after the category has been changed.

      Parameters

      • nodedata: NodeDataType

        a JavaScript object represented by a node, group, or non-link.

      • cat: string

        Must not be null.

      Returns void

    • A synonym for set

      Parameters

      • data: ObjectData

        a JavaScript object typically the value of a Panel.data and represented by a Node, Link, Group, simple Part, or item in a Panel.itemArray; or this model's modelData.

      • propname: string

        a string that is not null or the empty string.

      • val: any

        the new value for the property.

      Returns void

      see

      set

    • Change the node key that the given link data references as the source of the link.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      • key: Key

        This may be undefined if the link should no longer come from any node.

      Returns void

    • Change the information that the given link data uses to identify the particular "port" that the link is coming from.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      • portname: string

        This may be the empty string if the link should no longer be associated with any particular "port".

      Returns void

    • Change the container group for the given node data, given a key for the new group.

      Parameters

      • nodedata: NodeDataType

        a JavaScript object represented by a node, group, or non-link.

      • key: Key

        This may be undefined if there should be no containing group data.

      Returns void

    • Change the unique key of a given link data that is already in this model. The new key value must be unique -- i.e. not in use by another link data object. You can call findLinkDataForKey to check if a proposed new key is already in use.

      If this is called when linkKeyProperty is the empty string (i.e. its default value), this method has no effect. If this is called on a link data object that is not (yet) in this model, this unconditionally modifies the property to the new key value.

      Parameters

      Returns void

    • Change the unique key of a given node data that is already in this model. The new key value must be unique -- i.e. not in use by another node data object. You can call findNodeDataForKey to check if a proposed new key is already in use.

      This operation will check all data objects in the model and replace all references using the old key value with the new one.

      If this is called on a node data object that is not (yet) in this model, this unconditionally modifies the property to the new key value.

      Parameters

      • nodedata: NodeDataType

        a JavaScript object represented by a node, group, or non-link.

      • key: Key

      Returns void

    • Change the node key that the given link data references as the destination of the link.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      • key: Key

        This may be undefined if the link should no longer go to any node.

      Returns void

    • Change the information that the given link data uses to identify the particular "port" that the link is going to.

      Parameters

      • linkdata: LinkDataType

        a JavaScript object represented by a link.

      • portname: string

        This may be the empty string if the link should no longer be associated with any particular "port".

      Returns void

    • Produce an object representing the changes in the most recent Transaction. The structure of the object follows the same format as the JSON output from toIncrementalJson.

      Note that these incremental changes include the results of undo and redo operations.

      For GraphLinksModels, this method requires that GraphLinksModel.linkKeyProperty is not an empty string. If GraphLinksModel.linkKeyProperty is the empty string, that property will automatically be set to "key", and each link data object will get a unique key value, before producing the resulting data.

      Any node or link data objects contained in the "modified..." properties will be deep copies of the data in the model. The objects will contain proper copies of certain GoJS classes, and some common built-in objects such as Dates and RegExps. Other classes will just be copied as plain Javascript objects, so it is best to avoid using special classes in one's data.

      This method is most commonly used when GoJS must communicate with some external data source and maintain integrity between the two while avoiding serialization/deserialization.

        myDiagram.addModelChangedListener(e => {
      if (e.isTransactionFinished) {
      const dataChanges = e.model.toIncrementalData(e);
      ... update React state/save to database ...
      }
      });

      Caution: don't call JSON.stringify on the resulting object, because that will not properly handle any instances of JavaScript classes that are referenced by the object's properties. Instead call toIncrementalJson, which will produce a more compact textual serialization.

      Parameters

      Returns IncrementalData<NodeDataType, ObjectData, ObjectData> | null

      returns either null if no changes occurred, or an object containing incremental model changes for the given Transaction

      since

      2.1

    • Produce a JSON-format string representing the changes in the most recent Transaction. This writes out JSON for a model, but recording only changes in the given Transaction, with the addition of the "incremental" property to mark it as different from a complete model. Instead of the "nodeDataArray" property (and "linkDataArray" property for GraphLinksModels), this will have "inserted...", "modified...", and "removed..." properties that are non-empty Arrays.

      The "modifiedNodeData" Array holds JavaScript objects. The "insertedNodeKeys" and "removedNodeKeys" Arrays hold keys (numbers or strings) of data, not whole objects, that have been added and/or deleted. The "modelData" property holds the Model.modelData object, if it was modified.

      Note that it is entirely plausible for the same object be in or referenced by all three Arrays, because a single Transaction can include adding a node, modifying it, and removing it.

      The purpose of this method is to make it easier to send incremental changes to the server/database, instead of sending the whole model. Whereas it has always been easy to perform "batch" updates or "file saves":

        myDiagram.addModelChangedListener(e => {
      if (e.isTransactionFinished) {
      const json = e.model.toJson();
      // save the whole model upon each transaction completion or undo/redo
      ... send to server/database ...
      }
      });

      You can now easily send "incremental" updates:

        myDiagram.addModelChangedListener(e => {
      if (e.isTransactionFinished) {
      const json = e.model.toIncrementalJson(e);
      // record each Transaction as a JSON-format string
      ... send to server/database ...
      }
      });

      Note that these incremental changes include the results of undo and redo operations. Also, when you might call applyIncrementalJson, you will need to disable your Changed listener, so that it does not send spurious changes to your database during the process of apply incremental changes from the database.

      For GraphLinksModels, this method requires that GraphLinksModel.linkKeyProperty is not an empty string. If GraphLinksModel.linkKeyProperty is the empty string, that property will automatically be set to "key", and each link data object will get a unique key value, before producing the resulting text. The incremental JSON for GraphLinksModels will include "modifiedLinkData", "insertedLinkKeys", and "removedLinkKeys" properties that are non-empty Arrays.

      The same restrictions on data property names and data property values applies to this method as it does to toJson.

      Parameters

      Returns string

    • Generate a string representation of the persistent data in this model, in JSON format, that can be read in later with a call to Model.fromJson.

      Object properties that are not enumerable or whose names start with "_" are not written out.

      Functions are not able to be written in JSON format, so any properties that have function values will not be saved in the JSON string.

      There must not be any circular references within the model data. Any sharing of object references will be lost in the written JSON.

      Most object classes cannot be serialized into JSON without special knowledge and processing at both ends. The toJson and Model.fromJson methods automatically do such processing for numbers that are NaN and for objects that are of class Point, Size, Rect, Margin, Spot, Brush (but not for brush patterns), and for Geometry. For instances of those classes, special objects are written out with a property named "class" whose value will be one of the special cases that will be substituted by Model.fromJson: "NaN", "Date", "go.Point", "go.Size", "go.Rect", "go.Margin", "go.Spot", "go.Brush", "go.Geometry".

      However, we recommend that you use Binding converters (static functions named "parse" and "stringify") to represent Points, Sizes, Rects, Margins, Spots, and Geometries as string values in your data, rather than as Objects. This makes the JSON text smaller and simpler and easier to read.

      As a special case when serializing an object, if the property is named "points" and the property value is a List of Points, it will write an Array of numbers.

      Note that this is a method on the Model class. It cannot render unmodeled Parts such as the background grid or any Parts that you have added directly to a Diagram.

      Typical usage:

      const modelAsText = myDiagram.model.toJson();
      // now save this text string by sending it to your database

      Parameters

      • Optionalclassname: string

        The optional name of the model class to use in the output; for the standard models, this is their class name prefixed with "go.".

      Returns string

      a String in JSON format containing all of the persistent properties of the model.

    • Find a Part corresponding to the given data and call its Panel.updateTargetBindings method, in each Diagram that uses this Model.

      Caution: setting a data property without calling set and then calling this updateTargetBindings method will update GraphObjects that are bound to the property, but such data settings will not be recorded in the UndoManager and therefore will not be undone/redone, causing an inconsistency between the GraphObjects and the part data.

      Parameters

      • data: ObjectData

        The data object in this model that was modified.

      • Optionalsrcpropname: string

        If not present or the empty string, update all bindings on the target Part or item Panel otherwise update only those bindings using this source property name.

      Returns void

    • This static function parses a string in JSON format that was written by Model.toJson, and then constructs, initializes, and returns a model with that information.

      Note that properties with values that are functions are not written out by toJson, so reading in such a model will require constructing such a model, initializing its functional property values, and explicitly passing it in as the second argument.

      In order to serialize instances of some classes and enumerated values and some other cases, Model.toJson writes out special Objects that this Model.fromJson function substitutes with the intended values. Those special objects will have a property named "class" whose value will be one of the special substitution cases: "NaN", "Date", "go.EnumValue" (for compatibility), "go.Point", "go.Size", "go.Rect", "go.Margin", "go.Spot", "go.Brush", "go.Geometry".

      As a special case when deserializing an object, if the property is named "points" and the property value is an Array with an even number of numbers, it will substitute a List of Points.

      Typical usage:

      const modelAsText = ...;  // fetch the model in textual format from a database
      myDiagram.model = go.Model.fromJson(modelAsText);

      Parameters

      • s: string | ObjectData

        a String in JSON format containing all of the persistent properties of the model, or an Object already read from JSON text.

      • Optionalmodel: Model<any, any> | null

        an optional model to be modified; if not supplied, it constructs and returns a new model whose name is specified by the "class" property.

      Returns Model

      the supplied or created model loaded with data from the given string.