We have released version 3.1 of MindFusion JavaScript Diagram library. It contains the following new features and improvements:

Composite nodes
The CompositeNode class implements nodes whose appearance can be defined via composition of components and layout containers. The content of a composite node can be created by building a tree of components programmatically, or by loading a JSON template. This initial release includes layout containers such as StackPanel and GridPanel. Objects from the MindFusion.Drawing namespace now double as CompositeNode components (Image, Text, Path, Rect). Future versions will add interactive components like buttons and text editors. Extended overview is available here.

Animated layout
arrangeAnimated methods added to Diagram and ContainerNode classes display movement of items from their original locations to new locations assigned by the layout object. This can be used to create an explode effect by starting new layout from overlapping nodes on same position, or an insertion effect by adding a new node to an existing layout.

Overview improvements

• ScaleMode enumeration and properties added to Overview control implement several scaling modes. The FitAll element corresponds to the original behavior where the Overview always fits diagram's contents. FixedScale mode applies the scale specified via overview's ScaleFactor property. CombinedScales mode multiples overview's ScaleFactor by diagram's current ZoomFactor.
• If AllowZoom is enabled, users can zoom the diagram by resizing the overview's viewport tracking rectangle.
• MinVisibleFontSize specifies a threshold value that hides text if scaled font sizes become smaller.

Miscellaneous

• ImagePadding property of ShapeNode and Cell lets you set padding space between elements' borders and their Image.
• resizetoFitText method of TableNode resizes the columns and rows of tables to fit cells' texts.
• The new GridRouter class implements link routing using A* algorithm with customizable criteria costs exposed by its LengthCost, NodeVicinityCost and TurnCost properties.
• All sample projects now available in TypeScript.

Distribution for the latest version can be downloaded here, or from the clients area on our site:
https://mindfusion.eu/JsDiagramTrial.zip

Updated scripts are also available as diagram-library NPM package.

Enjoy!