Diagram - Simple View

This demo shows the Diagram component in Simple View mode. In this mode, the control does not divide the work area into pages and the diagram's content occupies all the available area inside the component.

To enable Simple View mode, set the simpleView property to true.

Was this demo helpful?

Thank you!

Feel free to share demo-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.

Thank you for the feedback!

Backend API

@(Html.DevExtreme().Diagram() .ID("diagram") .SimpleView(true) .PropertiesPanel(pp => pp .Visibility(DiagramPanelVisibility.Disabled) ) .Toolbox(t => t .Visibility(DiagramPanelVisibility.Disabled) ) .Nodes(ns => ns .DataSource(d => d .Array() .Key("ID") .Data(Model) ) .KeyExpr("ID") .TextExpr("Title") .ParentKeyExpr("HeadID") .AutoLayout(al => al .Type(DiagramDataLayoutType.Tree) ) ) )

using System.Web.Mvc; using DevExtreme.MVC.Demos.Models.SampleData; namespace DevExtreme.MVC.Demos.Controllers { public class DiagramController : Controller { public ActionResult SimpleView() { return View(SampleData.OrgItemsPlain); } } }

#diagram { height: 600px; }