Nodes are graphical objects that can be arranged in a diagram page.
These nodes can be added to the diagram surface either programtically, by defining them in XAML, or during run time by dragging and dropping them from
a built-in symbol palette.
The shapes of nodes can be set to any one of the predefined shapes provided, or you can specify a custom shape by assigning any user-defined WPF Path elements.
You can also design custom Path elements using Microsoft Expression Blend. Nodes can be grouped together and a common operations can be performed on them.
Built-in Shapes
Built-in Shapes
Image Hosted within a Node
Grouped Nodes
Connection Ports
You can define one or more ports on nodes for connecting them to other nodes.
Connection ports can be placed anywhere within a node or at its edges.
You can choose one of the predefined symbols like arrows, circles, or diamonds, or you can define
a custom connecton port. The look and feel of these connection ports is fully customizable.
Connection Ports for Nodes
Arrow, Circle, and Diamond Decorator Shapes
Connectors
Connectors are objects used to create a link between two nodes. Line connectors are used to represent a logical flow or connection between the nodes of a diagram.
Setting up such a connection will keep the connectors docked to the nodes when the nodes are moved around. Essential diagram provides orthogonal, bezier, and straight connectors.
You can also draw polylines using intermediate points. Essential Diagram provides line bridging support that creates a bridge to allow lines to cross over other lines at points of intersection.
Orthogonal, Straight, and Bezier Line Connectors
Line Connectors with Intermediate Points
Line Bridging
Arc Line Connectors
Advanced line routing options to treat some objects as obstacles and avoid them are also available.
Line routing options
Appearance
Several customizable options are provided to change the look and feel of different portions of a diagram, enabling you to create professional-looking diagrams
that reflect style patterns commonly used in business. Essential Diagram provides options to fully customize nodes, connectors, and connection ports.
Customized Label Properties
Custom Line Connectors, Decorator Shapes, and Node Styles
Data Binding
Essential Diagram provides out-of-the-box data binding support to many popular data sources including ObservableColletion, CollectionViewSource, and
all the collections implementing ICollectionView and IEnumerable that can bind to XML data sources.
Business Object Data Binding in a Diagram
Layout Manager
Diagram control provides a layout manager that automatically arranges the nodes.
Directed Tree Layout—Arranges nodes in a tree-like structure.Hierarchical Tree Layout—Arranges nodes in a tree-like structure. However, unlike the directed tree layout, the nodes in a hierarchical layout may have multiple parents.Radial Tree Layout—A specialized type of tree layout manager that arranges nodes in a circular layout.Table Layout—Arranges nodes in a tabular structure.
Directed Tree Layout with Left-to-Right Orientation
Hierarchical Tree Layout Top-to-Bottom Orientation
Radial Tree Layout
Table Layout
Bowtie-Style Diagram
User Interactions
Essential Diagram provides various user interactions like displaying ToolTips and context menus for nodes and connectors.
Context menus provide easy access to commonly used commands for nodes and connectors. Users can select a node or connector on which a command is to be executed, and
perform the desired command from the context menu which is displayed by right-clicking the node or connector. Users can zoom in and out of the diagram page and can also pan across the page using the mouse.
The Overview control is used to show a preview of large content with options to zoom and pan.
Context Menu for Nodes and Connectors
Zooming on a Diagram Page
Panning across a Diagram Page
Diagram in Fit to Page mode where everything is visible
Overview Control
Layers
You can define layers in a diagram. Any number of nodes and line connectors can be added to a layer, and the visibility of a layer's contents can be hidden by changing the visible property of that layer.
Before Hiding a Layer
After Hiding a Layer
Diagram Page
The surface on which all the nodes are rendered is fully customizable. The drawing area of the diagram control can be rendered with horizontal and vertical gridlines.
You can enable horizontal and vertical rulers to indicate the coordinates of the mouse pointer position with respect to the view. On zooming and panning, these rulers are adjusted to point to the exact coordinates.
Gridlines in a Diagram Page
Rulers in a Diagram Page
Rulers with time scale
Symbol Palette
The symbol palette is a large collection of predefined nodes. It allows nodes and line connectors to be easily dragged-and-dropped into a diagram. Custom symbols can also be added to the symbol palette. It also supports grouping and filtering symbols.
Symbol Palette Items
Customized Symbol Palette
Symbol Designer
Symbol Designer is a standalone application that lets you create and modify custom symbols. The custom shapes designed can then be consumed in your applications and also in the Diagram Builder application.
Symbol Designer application.
Easily create custom Symbols using the tools you are already familiar with. Symbols designed using Microsoft Expression Blend can be imported into a diagram symbol palette. An add-in to export symbols from within Microsoft Expression Blend is also available.
Symbol designed using Expression Blend.
Command Architecture
Essential Diagram provides several commands that enable users to easily perform commonly used operations like node alignment, sizing, nudging, spacing, undo, redo, z-order specification, and clipboard operations.
Export Options
Diagram content can be exported to the following file formats.
BitmapJPEGPNGGIFTIFFWDP
Serialization
Essential Diagram supports saving a diagram page for future use. This can be done by saving the page in XAML format.
The content of the page can also be saved into a stream from which it can be loaded again at a later point in time.
Print and Print Preview
Essential Diagram supports printing with the following user options to customize the output.
Print Preview—to view the page before printing.Color Modes—to select printing such as color, and black and white.Stretch—to adjust the fit of the image on the page.