Mermaid Extension

Introduction

A new extension for diagram generation using Mermaid, enabling text-based definitions to be rendered as dynamic SVG visualizations directly within Wisej.NET applications.

Technical Highlights

• Text-to-Diagram Rendering Supports generation of multiple diagram types (e.g., flowcharts, sequence diagrams, Gantt charts, class diagrams, state diagrams, pie charts) from declarative text syntax.

• SVG-Based Output Diagrams are rendered as scalable, resolution-independent SVG elements, ensuring consistent display across devices and screen sizes.

• Seamless UI Integration Can be embedded within Wisej.NET components such as pages, panels, and dashboards, with full compatibility with server-side logic and data binding.

• Dynamic and Interactive Rendering Enables runtime updates and integration with application state, supporting responsive and data-driven visualizations.

• Version-Control Friendly Diagram definitions are stored as plain text, facilitating collaboration, maintainability, and integration into standard development workflows.

Use cases

• Technical documentation and embedded help systems

• Workflow and process visualization

• Architecture and system design diagrams

• Lightweight data visualization scenarios

This extension simplifies the creation and maintenance of complex diagrams while integrating natively into the Wisej.NET application model.

Live Demo

See Mermaid extension in action here: https://demo.wisej.net/#Preview/Mermaid/Features