Creating and Deleting Items

New items can be added programmatically to the diagram by calling the constructors of the item's class, such as ShapeNode or DiagramLink, and adding the new instance via the addItem method. A shortcut to creating new items is provided by the methods of the Factory class. An instance of that class is returned by the factory property of Diagram. Factory methods such as createShapeNode and createDiagramLink accept respectively node position or link's origin and destination arguments, create an instance of the class and add it to the diagram. The Factory class can create instances of JsDiagram predefined item types, while addItem can be used to add instances of custom types as well.

JavaScript

var ShapeNode = MindFusion.Diagramming.ShapeNode;
var Rect = MindFusion.Drawing.Rect;

function initDiagram(diagram)
{
    // create the start node
    var startNode = diagram.factory.createShapeNode(10, 10, 30, 20);
    startNode.text = "start";

    // create the end node
    var endNode = new ShapeNode(diagram);
    endNode.bounds = new Rect(10, 60, 30, 20);
    endNode.text = "end";
    diagram.addItem(endNode);

    // connect the nodes
    diagram.factory.createDiagramLink(startNode, endNode);
}

If an existing item should be removed from the diagram, call the removeItem method. The clearAll method clears diagram contents by deleting all items.

By default, deleting a node also removes its links. Set the autoDeleteLinks property to false to prevent that, and disconnect the links instead.