mxGraph Reloaded Examples

• Basic
• Backgrounds
• Connections
• Drag-and-drop/copy-paste
• Editing
• Effects
• Events
• Icons/Images
• Labels
• Layout
• Miscellaneous
• Shapes/stencils
• Styles
• Toolbars
• XML/JSON
• Zoom/offpage

Anchors

This example demonstrates defining fixed connection points for all shapes.

Edge tolerance

This example demonstrates increasing the tolerance for hit detection on edges.

Fixed points

This example demonstrates using fixed connection points for connecting edges to vertices.

Hello Port

This example demonstrates using the isPort hook for visually connecting to another cell.

Orthogonal

This example demonstrates the use of port constraints and orthogonal edge styles and handlers.

Port References Example

This example demonstrates referencing connection points by ID. The main difference to the implementation where the connection point is stored in the connecting edge is that changes to the original port will be reflected in all existing connections since they reference that port.