Web Diagram Control - Early Access Preview (v19.1)

We are just two months away from our next major update, v19.1. As with all the other teams, we, the ASP.NET Team, will be posting about the new features that are coming up, sharing our progress, and letting you test major new functionality before we wrap up another development cycle. Although I'll soon be posting about the new features in our existing ASP.NET UI Library, in this particular post I thought I'd start with a brand new control, the DevExpress Web Diagram control.

Since it's a new one, and we're exploring what we can profitably include as functionality in its first iteration, I thought I'd introduce it, talk about its features, and point out the current limitations. That will help you to play around with it, and test the new functionality before we release the first version.

New Web Diagram Control

I'm sure you know what a Diagram Control is, and indeed know what you'd like from it (and we'll be asking you for input!), but let's start with a screenshot of the new Web Diagram Control in action:

Demo

We've published an online demo of the control so you can test it: DevExpress Web Diagram Control. The demo even gives you the opportunity to load your own data by clicking Import Data, although be warned there are currently some limitations to that feature.

Features

The diagram control is an advanced tool which is designed to satisfy different requirements:

1. It's a client-side control

The core part of the DevExpress Web Diagram control is implemented in TypeScript. Consequently all of the user experience and interactions run completely in the browser, the back-and-forth with the server is minimized. Apart from efficiency, this also give us the benefit that we can immediately introduce the control for all DevExpress web platforms: ASP.NET WebForms, ASP.NET Core, ASP.NET MVC, and DevExtreme.

2. Process and Flow diagrams

The new control provides for the modeling, editing, and displaying of diagram processes and flows.

We've added the capability to bind the control to your process model, and generate and auto-layout diagram items for each element of your model. An added benefit is that the control supports importing from Business Process Model Notation xml files.

3. Structures

The Web Diagram control's designer gives you the opportunity to display and edit structures, be they org charts, or representations of some kind of structured data. We plan to support two-way binding from your model to a diagram in the future.

4. Drawing and Prototyping

The designer includes a number of built-in shapes and will support importing of custom shapes in the final release. So you can use the Web Diagram Control to create, show, and edit your diagram documents with ease.

Current Limitations

Although I have -- dare I say it -- diagrammed what the control will have in its first release, this preview version has some limitations.

1. It is not within the current CTP release of our ASP.NET toolset. We plan on releasing a CTP of the control in a later beta, but for now, please try out the demo to see and understand its capabilities.
2. In the preview version, you can import data from external sources using an URL. Unfortunately, two-way binding is not yet supported.
3. The library of built-in shapes currently only includes these categories: standard and flow shapes. Custom shapes are not yet supported. The shape library will be expanded in future releases. Please let us know, using the survey below, which built-in shapes are important for your projects, it will help us to prioritize our TODO list.
4. The control supports diagram import/export using its own proprietary JSON format. Other formats (including XtraDiagram and Diagram for WPF xml files) are not yet supported.
5. At the time of writing, it only supports one auto-layout algorithm: tree view. We will be adding more auto-layout algorithms in future versions.

Feedback

Please take a moment to answer the questions in this short survey:

Download Preview Release

While this preview release does not contain the new web diagram control, you can still download the preview release and test the other v19.1 features. For our Web Diagram control, please test it using the online demo.

If you own an active Universal or DXperience subscription, you can download the CTP build from the DevExpress Download Manager and test the v19.1 features announced so far. Once you do, take a moment to let us know how well the new features address your requirements. This will help us fine-tune our code before the launch.

If you are using a trial version and want access to the new features today, purchase a Universal subscription license and you will automatically gain access to the CTP version. If you are ready to upgrade to Universal from another subscription level, email us at clientservices@devexpress.com for preferential upgrade pricing.

Thank you.

Free DevExpress Products - Get Your Copy Today