Behaviors
A demonstration of the Behavior property in ImageMap mode. Switch the behavior through the combo box at the top, then try interacting with the diagram to see the effect.
Run
Download
Additional Controls
This sample demonstrates the auxilliary controls available with NetDiagram: NodeListView, Overview and ZoomControl.
Custom Nodes
This example shows how to create a custom node class that exposes some new properties in addition to the ones defined by DiagramNode and implements its own drawing logic.
Decision Layout
Learn how to arrange an asp.net diagram that represents a decision making flowchart by using the DecisionLayout algorithm.
Fractal Layout
A demonstration of one of the numerous predefined automatic layout algorithms - the Fractal layout.
Lanes
This sample implements a Gantt-like chart using the swim-lane grid feature of the control. New items created with the mouse are automatically aligned to the grid lanes.
Layered Layout
This sample demonstrates the automatic layered layout algorithm. Create new nodes by clicking on the 'Random node' button and press the 'Layout' button to arrange the current diagram using the layered layout algorithm.
Map Editor
A static street image is used as a background for a diagram where the user can click to create nodes that represent transport stations and connect the nodes to create routes.
Postback
This sample demonstrates handling the NodeClicked event in ImageMap mode and shows how the diagram is preserved between postbacks.
Tree Map
This sample shows how to arrange the Diagram by using the TreeMapLayout algorithm. Choose different options to assign weights and note how the layout changes.
Tutorial #2
This example shows how to create a custom node class that exposes some new properties in addition to the ones defined by DiagramNode, implements its own drawing logic and has clipboard and undo/redo functionality.
Anchor Points
This sample shows how to define custom anchor patterns and assign them to diagram nodes. There are also several predefined anchor patterns to choose from.
Animations
An interactive decision-making diagram with animated nodes and links. You can adjust the animation type through the combo boxes at the top.
Flowcharter
A ready-to-use application for drawing flowcharts. Load one of the pre-defined diagrams or create your own flowchart by using the UI diagram controls available at the page.
Icon Nodes
This example shows how to create a custom node class that exposes some new properties in addition to the ones defined by DiagramNode and implements its own drawing logic.
Image Map
A class diagram that demonstrates how to use NetDiagram in ImageMap client side mode and how to handle server side events while operating in this mode.
Network Chart
This sample shows how to handle client side events in Canvas mode. Select an icon from the palette on the left, and click in the canvas on the right to create new nodes. Start drawing near the borders of a node to create a link.
Org Browser
This sample shows how to make AJAX calls from client side events. Requires Microsoft Ajax extensions for ASP.NET. Click on the '+' button near one of the nodes to expand the organization tree.
Routing
This example lets you experiment with the various link routing options. Move the sliders to alter a routing parameter value and draw links in the flowchart canvas on the left to see the effect of the new value.
