Diagramming for Blazor 1.0

Beautiful diagrams with rich user experience and fast rendering.

the rich feature set of a desktop component, the flexibility of a web library.

Diagramming for Blazor lets you add the desired flowchart in your web application or in any hybrid app for desktop and mobile.

Diagram Elements

From more than 100 predefined node shapes to custom nodes and shape libraries: MindFusion diagram for Blazor has every single element your project might ever need. You can display maps from ESRI shapefiles of OpenStreetMap, arrange hierarchical data in TreeView nodes or use control hosts to render other .NET controls: the possibilities are simply endless.

API Reference: Table of Predefined Shapes

User Interaction

The diagram component supports various behavior modes that specify how the flowchart responds to user actions: whether new shapes are created, existing ones connected, what kind of shape is drawn and more. The diagram view supports scroll, zoom and pan. User actions are recorded and it is possible to apply undo or redo. Users also can rotate shapes, copy, cut and paste them.

Online API Reference: User Interaction

Automatic Layouts

Layout algorithms can transform your diagram with a method call. When the right algorithm is applied, your flowchart becomes easy to understand and follow. The Blazor Diagramming library offers more than 20 automatic layout algorithms. On top of that you have automatic link routing: the ability of the diagram component to arrange the links in a way they look good and don't cross each other.

API Reference: MindFusion.Layout Namespace

Appearance

MindFusion diagramming for Blazor allows you to create, save and reuse styles and themes as you normally do with .NET elements. The diagram supports various text styles, fonts and brushes. The nodes can render images and text and you can have shadows and transparent nodes. When a special colouring is needed, you can use custom painting for nodes.

API Reference: Appearance

Additional Controls

Beside the main diagram component, your flowchart can render a ruler, an overview control, a listbox with shapes and more. All auxiliary controls are customizable and you can choose where and how they render.