NEVRON DIAGRAM FOR .NET

NEVRON DIAGRAM FOR .NET

The industry leading diagramming framework for WinForms, ASP.NET and MVC. An advanced solution for any application that needs to display interactive flowcharts, diagrams and maps.

 

Nevron Diagram for .NET
Advanced diagramming solution for Windows and Web applications

Nevron Diagram for .NET is simply the most feature-rich, fast and robust diagramming package for .NET available today. If you need to automatically create advanced relational charts and diagrams from your data, then look no further. 

Whether you need to display interactive Flow Charts, Organizational Charts, Maps, Process Control Diagrams, HMI Interfaces or automatically generate drawings from your data - Nevron Diagram has "out of the box" features to help you get your project done on time and on budget. 

Carefully crafted to meet diverse requirements and specific business needs, it provides flexible extensibility options, which will help you to integrate it perfectly in your project. 

Nevron Diagram for .NET contains a full range of advanced diagramming components for WinForms, ASP.NET and MVC application development that share a common diagramming API, document format and features. This helps you standardize your diagramming development across a wide range of .NET platforms. 

Features include: 
- Extensible interactivity and editing options. 
- Automatic graph and tree layouts. 
- Import from Database, Visio and ESRI data. 
- Hundreds of genuine clipart shapes. 
- 450+ examples with source code. 

 

Diagram Document Object Model-

Regardless of whether you are creating a WinForm or an ASP.NET diagramming application, with Nevron Diagram for .NET you use the same API to create your diagram documents. 
The set of objects you can use to construct a document is called document object model (DOM). The DOM of Nevron Diagram for .NET is very consistent and designed to be further extended. 

It all starts from the type of document you want to construct. In the diagram you basically have two types of documents:

• Drawing Document - represents a diagram drawing. A drawing basically consists of shapes, residing in layers. Shapes can be linked to form complex graph relationships. Drawings can be automatically laid-out, visually edited and exported to various raster and vector formats (for example: BMP, PNG, SVG to name a few). Drawings can be printed.

 

• Library Document - represents a collection of reusable drawing clippings (masters), which you can drag and drop in the drawing document. Masters can contain one or more shapes and the connections between them.

Both types of documents are constructed from a consistent set of elements, the most notable ones being shapes. Documents are displayed inside different views in the context of WinForm and ASP.NET environments.

 

Shapes and Groups-

When constructing diagrams, you basically work with shapes. In Nevron Diagram for .NET there are two types of shapes:

• 2D shapes
  2D shapes represent boxes, containing vector or raster primitives and text. 2D shapes are usually simply called shapes.

 

• 1D shapes
  1D shapes represent lines with different geometry and behavior, which interconnect other shapes. 1D shapes are often called connectors.

Nevron Diagram for .NET provides an extensive set of predefined shapes (see Predefined Shapes), but also lets you create custom ones by simply composing drawing primitives (lines, polylines, curves, rectangles, ellipses, text blocks etc.). 

All types of shapes can be grouped to create groups. Groups can also be by preference 1D or 2D. They act as a single shape, but are in fact composed from several others. Groups can be used for the creation of custom shapes. 

All 1D shapes have plugs, while both 1D and 2D shapes can have an arbitrary number of ports. A diagram with connections is thus primarily constructed by connecting plugs to ports. Nevron Diagram for .NET also supports an extended type of connection, which is performed by inward and outward ports - e.g. shapes can be connected by ports too. 

In Nevron Diagram you can convert a 1D shape to a 2D shape and vice versa via a single property. 

All types of shapes can have control points. Control points are used to visually change the appearance of a shape by simply dragging them. 

All types of shapes can have an arbitrary number of labels. Labels can be anchored to specific aspects of the shape.

 

Styles and Styling-

The visual appearance of all diagram elements is controlled via styles. Styles can be locally specified (per each element individually) or reused through the inheritance or style sheets. 

The usage of inheritance and style sheets greatly minimizes the effort needed to apply a consistent outlook to your diagram and then have the ability to easily change it. It also minimizes the memory footprint of your diagrams.

 

Behavior Customizations-

Nevron Diagram for .NET provides you with built-in options to consistenly customize the behavior of different diagram elements. Following is a brief overview of the most important behavior customization features:

• Protection
  Protection helps you protect certain diagram element aspects from being changed or viewed by the user. For example: you can protect shapes from being moved, resized, printed, exported to an image, deleted etc.

 

• Interaction style
  The interaction style defines the aspects of a shape, for which a view must create trackers (visual editors with handles) when the shape is selected. For example: when a 2D shape is selected, the view will create trackers for its bounds, rotation angle and pin point. If you want to remove the rotation angle and pin point trackers, you just have to apply the desired interaction style to the shape.

 

• Translation slaves
  Translation slaves lets you specify the shapes, which are automatically translated when a certain shape is translated. This helps you build rigid structures.

 

Visual Effects and Decorations-

Nevron Diagram for .NET gives you full control over advanced visual effects. Raster graphics effects include image filters, which can be applied to any element, displaying vector and/or raster content. Image filter effects can be combined with classical fill styles (solid color, gradient, hatch, image and advanced gradients). 

The component has the industry leading support for shadows - it provides several types of shadows and lets you choose the Z order in which they are dropped (behind document, behind layer etc.). 

Diagram specific decorations are also not left behind. Nevron Diagram for .NET can automatically display bridges (hops) on connector intersections and self intersections. The bridges appearance is controlled via styling. 

In diagramming arrowheads are usually used to distinguish between the different types of relations (one to many, one to one etc). Nevron Diagram has numerous built-in arrowheads, provides the ability to define custom ones and lets you customize their appearance via styling.

 

Graphs and Trees-

Nevron Diagram for .NET has a built-in support for graph and tree data structures and the core operations with them: 
For example, performing different traversals - depth first, breadth first etc., checking whether the graph is acyclic, whether it is a tree and so forth. 

Graph and tree data structures can be generated from the shapes of a drawing document. This gives you the needed flexibility to operate with a visually constructed diagram as if it is a simple graph or tree.

 

Measurement Units-

You won't find many diagram components which work transparently with different measurement units. In Nevron Diagram for .NET you can use Metric, English and pixel units to define your drawing content measurements. The component also provides support for drawing scale, which lets you work with either too small or too large drawings (for example: diagrams measured in nanometers or kilometers).

 

Automatic Layouts-

The automatic arrangement of diagrams is an indispensable feature, especially when diagrams are either too large or are automatically generated. Nevron Diagram for .NET comes equipped with a sophisticated set of automatic layouts. Following is a brief overview:

 

Obstacle Avoidance Routing

The obstacle avoidance routing of routable connectors addresses user laid-out diagrams in which certain connectors must be automatically rerouted not to cross any obstacles (shapes) in their path. Nevron Diagram for .NET provides support for both Mesh and Grid connectors routing, which is automatically performed. Addressed are issues like minimal bendings, port headings etc.

 

Tree Layouts

Nevron Diagram for .NET provides an extended set of automatic layouts, which deal with the shapes placement and connectors routing in the case of diagrams representing trees. Implemented is the following set of tree layouts: 
 

• Layered Tree Layout
  Layouts the tree vertices in layers. Supports breadth compaction. Produces both straight line and orthogonal tree drawings. Supports layout direction (top-to-bottom, left-to-right etc.).

 

• Compact Depth Tree Layout
  The depth arrangement of the vertices is as compact as possible. This layout supports breadth compaction. Produces both straight line and orthogonal tree drawings. Supports layout direction (top-to-bottom, left-to-right etc.).

 

• Tip Over Tree Layout
  Layouts the children vertices of a vertex in either a single row or a single column. The children placement can be specified on a per-vertex basis. Produces orthogonal tree drawings.

Balloon Tree Layout
Layouts the children vertices in a single circle around its parent vertex. The children angular range can be controller. Produces straight line tree drawings.

 

Graph Layouts

Nevron Diagram for .NET provides an extended set of automatic layouts, which deal with the shape placement and connector routing in the case of diagrams, representing graphs. Implemented is the following set of graph layouts: 
 

• Layered Graph Layout (Hierarchical Graph Layout)
  This layout distributes vertices to layers. It tries to minimize the number of edge crossings and edge bends. Supports layout direction (top-to-bottom, left-to-right etc.). Produces polyline graph drawings.

 

• Orthogonal Graph Layout
  This layout tries to display the graph only with orthogonal edges and tries to minimize the drawing area, edge crossings and edge bends.

 

• Symmetrical Graph Layout
  This is a force directed layout, which aims to produce a straight line graph drawing with uniform edge lengths. It couples attractive and repulsive forces, which balance each other at user-specified desired edge length. Because of that the produced drawings tend to be symmetrical.

 

• Spring Graph Layout
  This is a force directed layout, which aims to produce a straight line graph drawing, which reflects the nature of the graph. It couples an electrical force (repels the vertices, which are close to each other) and a spring force (tries to enforce a certain distance between connected vertices). The parameters of the spring force can be specified on a per edge basis (e.g. some edges can be longer and/or stiffer than others).

 

• Barycenter Graph Layout
  This is a force directed layout, which splits the graph into fixed and free vertices. It places the fixed vertices at a strictly convex polygon and then places the free vertices at their barycenter (center of mass). This layout produces straight-line graph drawings.

 

• Radial Graph Layout
  This is a circular graph layout, which layouts the graph in concentric circles. Produces straight-line graph drawings.

 

Cells Layouts

Sometimes it is needed to arrange only the vertices of the graph. In these cases each vertex can be treated a cell. Nevron Diagram for .NET implements the following cells layouts: 
 

• Stack Layout
  The stack layout represents a directed, constrained cells layout, which stacks the cells in horizontal or vertical order. Depending on the layout direction, the layout is constrained by either width or height.

 

• Flow Layout
  The flow layout represents a directed constrained cells layout, which arranges the cells in horizontal or vertical lanes. The flow layout does not preserve tabular metrics.

 

• Table Layout
  The table layout represents a directed constrained cells layout, which arranges cells in a tabular manner (e.g. preserves tabular metrics).

 

• Dock Layout
  The dock layout represents a space eating cells layout, which places vertices at per-vertex specified docking areas of the currently available layout area.

 

Visio Stencil Importer-

The Nevron Diagram Visio Stencil Importer will allow you to import and reuse the standard or custom designed MS Visio shapes inside your projects which use Nevron Diagramming controls. It takes as an input an XML serialized Visio stencil (VSX format) and imports its shapes in a Nevron library document which you can use with Nevron diagrams. 

Review the Nevron Diagram Gallery for some examples of imported Visio Shapes inside Nevron Diagram. 

We are providing support for additional customization of the shapes and full integration for desktop or web applications. Now, you can build more complex and stylish diagrams by combining the Visio shapes with the power of Nevron Diagramming components. Developers can exploit all the functionality of the Nevron Diagram to further customize and fine-tune your projects, well beyond the capabilities of any other diagramming solution available.

 

Maps (part of Nevron Diagram for .NET Enterprise edition)-

Nevron Diagram for .NET has built-in support for display of maps. ESRI shapefiles (the industry leading standard for storing map data) can be easily imported in any diagram with just a few lines of code. 

Maps and diagrams fit perfectly together – in many cases the simple vector data provided by the ESRI shapefiles needs additional decorations and interactivity extensions. For example: you may want to display predefined shapes on certain points of interest, use different color coding rules depending on the data associated with the shape, provide the user with the ability to drag and drop objects on maps etc, provide hand drawing etc. – in all these scenarios you will soon discover that you do not need a simple map component – you need a diagram with map support. 

Following is a brief overview of the most important mapping features:

• Supports ESRI shapefile format - the industry leading standard
• Supports 22 projection types
• Intelligent layer properties- show/hide layers based on zoom level
• Automatic naming and labeling of map elements through data field association
• Full programmatic access to map elements including shapes and paths

 

Thick client (WinForms) and Visual Editing-

Nevron Diagram for .NET provides the leading built-in support for developing thick client diagramming applications.

 

Ready to use Controls

Nevron Diagram for .NET comes equipped with several ready to use controls, which can help you create a standalone diagramming application in minutes. In fact, the Diagram Designer application, which is included in the package, is built only by assembling the following controls:

• Drawing View
  The drawing view helps you display and edit drawing documents. Drawing views are feature-rich and help you zoom, pan, stretch and fit documents. Drawing views can edit numerous shape features via interactive editors (trackers).

 

• Library View
  The library view helps you display and edit library documents. You can drag and drop shapes from the library view to the drawing view and vice versa.

 

• Pan and Zoom Control
  The pan and zoom control helps you display a bird's eye view of the document, which is being edited in its master drawing view. It also lets you interactively pan and zoom the master drawing view.

 

• Diagram Command Bars Manager
  The diagram command bars manager helps you visualize and execute the set of predefined commands, which can be performed on drawing and library views.

 

• Diagram Properties Browser
  The diagram, properties browser helps you instantly edit the properties of the document, the active layer, the selected element or the view.

 

• Diagram Status Bar
  The diagram status bar displays important information about the current state of a drawing view (size of the selected element, keyboard state, measurement unit etc.).

 

Undo/Redo

Nevron Diagram for .NET has support for Undo/Redo that works for everything the user does. The support for Undo/Redo is deeply integrated in the product and provides you with a transaction based programming model - this means that not only the user actions, but also the programmable actions can be undone and redone.

 

Tools

Nevron Diagram for .NET takes a radical approach towards processing the user gestures in both drawing and library views. All UI events are processed via tools, which are maintained by a controller, assigned to each view. This helps you easily configure the way, in which the user interacts with your diagram, which is achieved by simply enabling/disabling certain tools. If the myriad of predefined tools does not fit in your particular integration case, you can enrich your application by implementing custom tools.

 

Advanced Visual Aids

Nevron Diagram for .NET has the industry leading support for visual aids. Following is a brief overview: 
 

• Previews
  All operations, which the user performs with shapes, are previewed. For example: if you move shapes, drag and drop shapes, rotate or resize shapes, the diagram will automatically generate previews for the shapes, upon which the operation is performed. This helps the user see the effect of the action, before it is actually committed. All previewed actions can be canceled by pressing the Esc key.

 

• Snapping
  Previews are smartly snapped. Snapping is context sensitive. For example, if you move a connector plug, it tries to snap to inward ports first. If you move a shape, it tries to snap its outward ports to inward ports first. If you rotate a shape, the diagram tries to snap the rotation angle and so forth. Snapping can be tuned in numerous ways.

 

• Grid and Rulers
  All previews can be snapped to grid lines and ruler ticks. The grid and ruler components are built in each drawing view. Both the grid and rulers have smart scales - for example, if you zoom in/out the diagram, they try to adjust their tick steps automatically, in order to fill the view port area in the best way (e.g. automatically increase or decrease the step). They can of course have a fixed step too, if you prefer. Both grid and rulers can operate in different measurement units.

 

• Auto scrolling
  Auto-scrolling helps the user to scroll the view, while moving shapes, by just moving the mouse close the view rims.

 

• Attention to detail
  Nevron Diagram for .NET pays great attention to visual aids details. 
  For example: The cursors, which appear on resize handles, are properly oriented. Many operations accept Ctrl/Shift modifications (Ctrl + Move for example duplicates a shape). Tooltips appear on handles, control points, rulers etc. Connection ports are highlighted to indicate connection. Selection target shapes are highlighted. Moved region bounds are projected on the rulers. Mouse cursor position is projected on rulers. Multiple moved shapes bounds are displayed. And many more...

 

Thin client (ASP.NET) and AJAX-

Nevron Diagram for .NET provides built-in support for developing interactive thin client diagramming applications. It can operate either in Postback or in AJAX mode. Following is a brief description of the thin client modes:

ASP.NET AJAX Mode

Nevron Diagram for .NET comes with a powerful, yet easy to use built-in set of AJAX interactivity styles. It is based on the Nevron AJAX Framework, which is a reliable, fault tolerant and cross-browser compatible JavaScript library, that converts the simple diagram images inside your web page into an interactive client side application with flicker-free asynchronous image updates. Following is a brief overview of the AJAX features of Nevron Diagram for .NET:

• Refresh and Auto Refresh
  The diagram inside your web page can be configured to refresh itself within a specified update interval by simply enabling auto refresh and implementing the server side logic that will modify the diagram on refresh. The diagram can be updated also on demand through the client side JavaScript API, exposed by the Nevron AJAX Framework.

 

• Client Side AJAX Tools
  Most of the Nevron Diagram for .NET AJAX functionality is based on the controller/tools architecture. Pure client side tools that work with an updateable diagram image are the Tooltip tool, the Dynamic cursor tool and the Browser redirect tool. 
  In addition, a set of tools is available that intercept the user input and route it via AJAX calls to the server for processing. All mouse events can be enabled for AJAX routing, helping you create drill-down functionality and add hover effects. The controller/tools architecture allows you to easily extend the AJAX functionality by creating new custom tools.

 

• Reliability and Fault Tolerance
  You should think of an AJAX web page as of a classical client-server application. The client is implemented with JavaScript classes, running within the browser's DOM. The server is your ASP.NET AJAX enabled web form. Client and server communicate asynchronously and once initialized, the client runs independently from the server and is operational even if the server is unavailable. The Nevron AJAX Framework implements all the necessary logic, required to adequately notify the user of server unavailability and to resume operation when the connection to the server is restored.

 

ASP.NET Postback Mode

Nevron Diagram for .NET provides a set of useful features that help you add interactivity to your web application, while sticking to the more traditional and simple postback technology:

• Interactive Image Maps
  Nevron Diagram for .NET can send an HTML image map to the client browser, which allows you to build web applications with drill down capabilities. The interactive image map helps you add the following interactivity to your diagram: 
  - client side browser redirect, with configurable target URL for every diagram element; 
  - dynamic cursor, that changes when the user hovers over diagram elements 
  - client side tooltips. 
  It also provides a way to inject client side script blocks to be executed on user input on per-diagram element basis.

 

• SVG Image Response
  The SVG image response sends to the client a rich vector graphics image. This helps you have the diagram image rescaled in the web browser without loss of quality, which would be the case if rescaling raster format images. The SVG format also allows client side interactivity such as mouse hover effects.