Show theme settings Shopping cart Download trialFree Trial
Change Theme Settings
Change Theme Settings
Themes
 
Show All Themes
v
...v

Node and Edge Data Sources

v
po
po
x
Text
v
v
po
Object
Line style
v
Line width
+
-
popo
Connector
Type
v
Start
v
End
v
Layered




Tree




Page
Size
v
Orientation
v
po


The DevExpress ASP.NET MVC Diagram extension provides the Bind(object nodeDataObject, object edgeDataObject) method that allows you to load a tree or a graph structure from two data sources: the nodeDataObject for shapes and edgeDataObject for shape connectors.

While binding, the extension automatically creates shapes and connectors and retrieves their property values from the corresponding data items. The extension implements mapping properties that point to the data fields that contain the data:

You should add mapping information for a shape's Key and a connector's Key, FromKey, and ToKey properties.

The BatchUpdateRouteValues property specifies a Controller and Action that handle callbacks related to node and edge updates. When you update inserted items' data, use the MapInsertedItemKey method to provide key values for the items.

The SettingsAutoLayout property specifies the auto-layout algorithm and orientation the extension uses to build a diagram.

Collapse/Expand
Local Copy of this Demo
To inspect the source code for this demo on your machine, you must first install our components via the DevExpress Component Installer.
You can open a local copy of this online demo directly from this webpage (if using v20.2.8, 21.1.4 or higher).
Open CS Solution
The source code files for this demo are installed (by default) in the following directory:
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\CS\MVCxDiagramDemos