diff --git a/aspnetmvc/Diagram/Data-Binding.md b/aspnetmvc/Diagram/Data-Binding.md index 6722b7996..c00e1e903 100644 --- a/aspnetmvc/Diagram/Data-Binding.md +++ b/aspnetmvc/Diagram/Data-Binding.md @@ -1,13 +1,13 @@ --- layout: post -title: Populate Diagram from external data sources -description: How to populate the Diagram from the local data, remote data, or HTML tables? +title: Data Binding support in ASP.NET MVC Diagram Control | Syncfusion +description: Learn here about data binding support in Syncfusion Essential ASP.NET MVC Diagram Control, its elements, and more. platform: ejmvc control: Diagram documentation: ug --- -# Data Binding +# Data Binding in ASP.NET MVC Diagram * Diagram can be populated with the nodes and connectors based on the information provided from an external data source. * Diagram exposes its specific data-related properties allowing you to specify the data source fields from where the node information has to be retrieved from. @@ -92,7 +92,7 @@ public Array GetDataSource() {% endhighlight %} {% endtabs %} -![](Data-Binding_images/Data-Binding_img1.png) +![ASP.NET MVC Diagram Local Data](Data-Binding_images/Data-Binding_img1.png) ## Remote Data @@ -149,7 +149,7 @@ public ActionResult Index() {% endhighlight %} {% endtabs %} -![](Data-Binding_images/Data-Binding_img2.png) +![ASP.NET MVC Diagram Remote Data](Data-Binding_images/Data-Binding_img2.png) ## HTML Table Data @@ -279,9 +279,9 @@ The following code illustrates how to convert HTML table to the Diagram. {% endhighlight %} {% endtabs %} -![](Data-Binding_images/Data-Binding_img4.png) +![ASP.NET MVC Diagram HTML Table Data](Data-Binding_images/Data-Binding_img4.png) -# CRUD +## CRUD * This feature allows the user to read the DataSource and perform add/edit/delete the data in datasource at runtime. diff --git a/aspnetmvc/Diagram/Getting-Started.md b/aspnetmvc/Diagram/Getting-Started.md index 65451c96b..e7e502781 100644 --- a/aspnetmvc/Diagram/Getting-Started.md +++ b/aspnetmvc/Diagram/Getting-Started.md @@ -1,13 +1,13 @@ --- layout: post -title: Getting started with Syncfusion Essential Diagram for ASP.NET MVC -description: Getting started walk through to create your first Flow Diagram and Organizational Chart Diagram +title: Getting started with ASP.NET MVC Diagram Control | Syncfusion +description: Learn here about getting started with Syncfusion Essential ASP.NET MVC Diagram Control, its elements, and more. platform: ejmvc control: Diagram documentation: ug --- -# Getting Started +# Getting Started with ASP.NET MVC Diagram Getting started with your MVC Diagram is easy. You can start by creating a simple flow chart. @@ -28,7 +28,7 @@ Getting started with your MVC Diagram is easy. You can start by creating a simpl 3\. This creates an empty diagram -![](/aspnetmvc/Diagram/Getting-Started_images/Getting-Started_img1.png) +![ASP.NET MVC Diagram Initialization](Diagram/Getting-Started_images/Getting-Started_img1.png) ### Create and add Node @@ -72,7 +72,7 @@ N> `Labels` property is an array, which indicates that more than one label can b Added node will be displayed in diagram as shown below. -![](/aspnetmvc/Diagram/Getting-Started_images/Getting-Started_img2.png) +![ASP.NET MVC Diagram Create and add Node](Diagram/Getting-Started_images/Getting-Started_img2.png) ### Connect nodes @@ -126,7 +126,7 @@ Connect these two nodes by adding a `connector` into `Connectors` collection wit * `Connector` connects the two nodes as shown below. -![](/aspnetmvc/Diagram/Getting-Started_images/Getting-Started_img3.png) +![ASP.NET MVC Diagram Connect nodes](Diagram/Getting-Started_images/Getting-Started_img3.png) * Default values for all nodes and connectors can be set using default settings. For example if all nodes have same `Width` and `Height`, we can move such properties into `DefaultSettings`. Above code can be rewritten as shown below. @@ -236,7 +236,7 @@ Similarly we can add required nodes and connectors to form a complete flow diagr Final flow chart will looks as shown below. -![](/aspnetmvc/Diagram/Getting-Started_images/Getting-Started_img4.png) +![ASP.NET MVC Diagram Complete flow diagram](Diagram/Getting-Started_images/Getting-Started_img4.png) ## Automatic organization chart @@ -357,4 +357,4 @@ Following code examples indicate how to define the default appearance of node an * The Employee details are displayed in the Diagram as follows. -![](/aspnetmvc/Diagram/Getting-Started_images/Getting-Started_img5.png) +![ASP.NET MVC Diagram Apply org chart layout](Diagram/Getting-Started_images/Getting-Started_img5.png)