mxGraph XML Editor & Converter

Create and edit mxGraph XML with advanced features, then convert to React Flow JSON

XML Templates with Advanced Features

mxGraph XML Editor

Valid XML

Lines: 21Size: 1.38KB

React Flow JSON Output

Success

mxGraph Advanced Features Guide

Swimlanes & Containers:

• style="swimlane" creates container elements
• horizontal=1 for horizontal lanes
• Child elements use parent="lane-id"
• Auto-sizing with startSize property

Shapes & Styling:

• shape=rhombus for gateways
• shape=ellipse for events
• shape=cylinder for databases
• Rich styling with fillColor, strokeColor, etc.

Edge Constraints:

• edgeStyle=orthogonalEdgeStyle for routing
• strokeWidth for visual hierarchy
• dashed=1 for optional connections
• Edge labels with positioning

Auto-sizing & Layout:

• whiteSpace=wrap for text wrapping
• html=1 for rich text support
• Geometry constraints with min/max sizes
• Automatic positioning based on content

Pro Tips: Use the templates above to see real examples of advanced mxGraph features. Each template demonstrates different capabilities like swimlanes, constraints, auto-sizing, and complex styling that will be preserved when converting to React Flow JSON.