Example of Serpentine Diagram in ASP.NET Core Diagram Control
This sample visualizes a serpentine layout using the Syncfusion® ASP.NET Core Diagram to showcase 20 important medical research breakthroughs that transformed healthcare between 1796 and 1996.
DEMO
SOURCE
Medical Research Breakthroughs
A serpentine journey through 20 pivotal medical discoveries that changed healthcare forever
A serpentine layout arranges elements along a zigzagging or winding path. This timeline presents each breakthrough as part of a continuous sequence. When the layout reaches the edge of the view, it wraps to the next line and reverses direction, creating a true serpentine flow.
Key Features:
- Dynamic Serpentine Flow: Nodes are automatically arranged in a winding path that wraps based on the available container width.
- Interactive Nodes: Hover over any node to see a detailed tooltip with information about the medical breakthrough.
- Custom Connectors: The timeline uses straight connectors for nodes in the same row and elegant bezier curves for wrapping between rows.
- Zoom and Pan: Use the buttons to zoom in and out at specific zoom levels.