Skip to content

Commit 3e883c3

Browse files
kmuthukumarmkmkmuthukumarmkm
authored
Merge branch 'hotfix/hotfix-v26.1.35' into EJ2-600228-formatupdate
2 parents a4469c3 + 17a6528 commit 3e883c3

File tree

14 files changed

+230
-1
lines changed

14 files changed

+230
-1
lines changed

‎ej2-asp-core-mvc/code-snippet/diagram/connectors/connectorCollection/connectorCollection.cs

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Web;
5+
using System.Web.Mvc;
6+
using Syncfusion.EJ2.Diagrams;
7+
using System.Drawing;
8+
9+
namespace EJ2MVCSampleBrowser.Controllers.Diagram {
10+
public partial class DiagramController: Controller {
11+
// GET: Nodes
12+
public ActionResult Nodes() {
13+
List<DiagramConnector> Connectors = new List<DiagramConnector>([
14+
{ id: 'connector1', sourcePoint: { x: 100, y: 100 }, targetPoint: { x: 150, y: 150 } },
15+
{id: 'connector2', type: 'Orthogonal', sourcePoint: { x: 170, y: 170 }, targetPoint: { x: 200, y: 200 }},
16+
{ id: 'connector3', type: 'Bezier', sourcePoint: { x: 320, y: 320 }, targetPoint: { x: 400, y: 400 } }
17+
];);
18+
Connectors.addElemets(new DiagramConnector());
19+
ViewBag.connectors = Connectors;
20+
return View();
21+
}
22+
}
23+
}

‎ej2-asp-core-mvc/code-snippet/diagram/connectors/connectorCollection/tagHelper

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
<ejs-diagram id="container" width="100%" height="700px" connectors="@ViewBag.connectors">
2+
</ejs-diagram>

‎ej2-asp-core-mvc/code-snippet/diagram/group/groupCollection/groupCollection.cs

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Web;
5+
using System.Web.Mvc;
6+
using Syncfusion.EJ2.Diagrams;
7+
using System.Drawing;
8+
9+
namespace EJ2MVCSampleBrowser.Controllers.Diagram {
10+
public partial class DiagramController: Controller {
11+
// GET: Nodes
12+
public ActionResult Nodes() {
13+
List < DiagramNode > nodes = new List < DiagramNode > ();
14+
Node1.Add(new DiagramNodeAnnotation() {
15+
Content = "node1", Style = new DiagramTextStyle() {
16+
Color = "White", StrokeColor = "None"
17+
}
18+
});
19+
nodes.addElements(new Node() [{ id: "rectangle1", offsetX: 100, offsetY: 100, width: 100, height: 100, annotations: [{ content: 'node1' }] },
20+
{ id: "rectangle2", offsetX: 200, offsetY: 200, width: 100, height: 100, annotations: [{ content: 'node2' }] },
21+
{ id: 'group', children: ['rectangle1', 'rectangle2'] },
22+
{ id: "rectangle3", offsetX: 400, offsetY: 400, width: 100, height: 100, annotations: [{ content: 'node1' }] },
23+
{ id: "rectangle4", offsetX: 500, offsetY: 500, width: 100, height: 100, annotations: [{ content: 'node2' }] },
24+
{ id: 'group', children: ['rectangle3', 'rectangle4'], padding: { left: 10, right: 10, top: 10, bottom: 10 } }
25+
]);
26+
ViewBag.nodes = nodes;
27+
return View();
28+
}
29+
}
30+
public class Node: DiagramNode {
31+
public string text;
32+
}
33+
}

‎ej2-asp-core-mvc/code-snippet/diagram/group/groupCollection/tagHelper

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<ejs-diagram id="container" width="100%" height="700px" nodes="ViewBag.nodes">
2+
3+
</ejs-diagram>

‎ej2-asp-core-mvc/code-snippet/diagram/node/nodescollection/nodescollection.cs

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Web;
5+
using System.Web.Mvc;
6+
using Syncfusion.EJ2.Diagrams;
7+
using System.Drawing;
8+
9+
namespace EJ2MVCSampleBrowser.Controllers.Diagram {
10+
public partial class DiagramController: Controller {
11+
// GET: Nodes
12+
public ActionResult Nodes() {
13+
List < DiagramNode > nodes = new List < DiagramNode > ();
14+
List < DiagramNodeAnnotation > Node1 = new List < DiagramNodeAnnotation > ();
15+
Node1.Add(new DiagramNodeAnnotation() {
16+
Content = "node1", Style = new DiagramTextStyle() {
17+
Color = "White", StrokeColor = "None"
18+
}
19+
});
20+
nodes.Add(new Node() [
21+
{ id: 'node16', offsetX: 35, offsetY: 260 },
22+
{ id: 'node17', offsetX: 140, offsetY: 260 },
23+
{ id: 'node18', offsetX: 240, offsetY: 260 }
24+
]);
25+
ViewBag.nodes = nodes;
26+
27+
28+
return View();
29+
}
30+
}
31+
public class Node: DiagramNode {
32+
public string text;
33+
}
34+
}

‎ej2-asp-core-mvc/code-snippet/diagram/node/nodescollection/tagHelper

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<ejs-diagram id="container" width="100%" height="700px">
2+
<e-diagram-nodes>
3+
<e-diagram-node id='node1' offsetX="100" offsetY="100" width="100" height="100" borderWidth="2">
4+
<e-node-style fill="darkcyan">
5+
</e-node-style>
6+
</e-diagram-node>
7+
</e-diagram-nodes>
8+
</ejs-diagram>

‎ej2-asp-core-mvc/diagram/connectors.md

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -100,6 +100,28 @@ diagram.remove(connectors)
100100

101101
```
102102

103+
## Add collection of connectors at runtime
104+
105+
* The collection of connectors can be dynamically added using 'addElements' method.Each time an element is added to the diagram canvas, the 'collectionChange' event will be triggered.
106+
107+
{% tabs %}
108+
{% highlight cshtml tabtitle="CSHTML" %}
109+
{% include code-snippet/diagram/connectors/connectorCollection/tagHelper %}
110+
{% endhighlight %}
111+
{% highlight c# tabtitle="ConnectorCollection.cs" %}
112+
{% include code-snippet/diagram/connectors/connectorCollection/connectorCollection.cs %}
113+
{% endhighlight %}
114+
{% endtabs %}
115+
116+
{% elsif page.publishingplatform == "aspnet-mvc" %}
117+
118+
{% tabs %}
119+
{% highlight c# tabtitle="ConnectorCollection.cs" %}
120+
{% include code-snippet/diagram/connectors/connectorCollection/connectorCollection.cs %}
121+
{% endhighlight %}
122+
{% endtabs %}
123+
{% endif %}
124+
103125
## Connectors from palette
104126

105127
Connectors can be predefined and added to the symbol palette. You can drop those connectors into the diagram, when required.

‎ej2-asp-core-mvc/diagram/group.md

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -123,6 +123,32 @@ var group= {
123123
diagram.add(group);
124124
```
125125

126+
127+
## Add collection of group nodes at runtime
128+
129+
* The collection of group nodes can be dynamically added using 'addElements' method.Each time an element is added to the diagram canvas, the 'collectionChange' event will be triggered.
130+
131+
{% if page.publishingplatform == "aspnet-core" %}
132+
133+
{% tabs %}
134+
{% highlight cshtml tabtitle="CSHTML" %}
135+
{% include code-snippet/diagram/group/groupCollection/tagHelper %}
136+
{% endhighlight %}
137+
{% highlight c# tabtitle="GroupCollection.cs" %}
138+
{% include code-snippet/diagram/group/groupCollection/groupCollection.cs %}
139+
{% endhighlight %}
140+
{% endtabs %}
141+
142+
{% elsif page.publishingplatform == "aspnet-mvc" %}
143+
144+
{% tabs %}
145+
{% highlight c# tabtitle="GroupCollection.cs" %}
146+
{% include code-snippet/diagram/group/groupCollection/groupCollection.cs %}
147+
{% endhighlight %}
148+
{% endtabs %}
149+
{% endif %}
150+
151+
126152
## Container
127153

128154
Containers are used to automatically measure and arrange the size and position of the child elements in a predefined manner. There are two types of containers available.

‎ej2-asp-core-mvc/diagram/images/connectionDirection.png

16.9 KB
Loading

‎ej2-asp-core-mvc/diagram/images/page_rotationreference.gif

196 KB
Loading

‎ej2-asp-core-mvc/diagram/images/parent_rotationreference.gif

272 KB
Loading

‎ej2-asp-core-mvc/diagram/labels.md

Lines changed: 22 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -650,4 +650,25 @@ You can add any number of annotations to a node or connector.
650650

651651
## Constraints
652652

653-
The constraints property of annotation allows to enable or disable certain annotation behaviours. For instance, you can disable annotation editing.
653+
The constraints property of annotation allows to enable or disable certain annotation behaviours. For instance, you can disable annotation editing.
654+
655+
## Annotation rotation
656+
657+
The [`rotationReference`] property of an annotation allows you to control whether the text should rotate relative to its parent node or the Page. The following code examples illustrate how to configure rotationReference for an annotation.
658+
659+
```javascript
660+
var diagramElement = document.getElementById('element');
661+
var diagram = diagramElement.ej2_instances[0];
662+
var annotation = [{
663+
id: 'label1',
664+
content: 'Annotation',
665+
//To disable annotation rotation
666+
rotationReference: 'Page'
667+
}]
668+
diagram.dataBind();
669+
```
670+
671+
| Value | Description | Image |
672+
| -------- | -------- | -------- |
673+
| Page | When this option is set, the annotation remains fixed in its original orientation even if its parent node is rotated. | ![No_Rotation](images/page_rotationreference.gif) |
674+
| Parent | In this case, the annotation rotates along with its parent node. | ![Rotation](images/parent_rotationreference.gif)|

‎ej2-asp-core-mvc/diagram/nodes.md

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,30 @@ var node = {
8080
diagram.add(node);
8181
```
8282

83+
## Add collection of nodes at runtime
84+
85+
* The collection of nodes can be dynamically added using 'addElements' method.Each time an element is added to the diagram canvas, the 'collectionChange' event will be triggered.
86+
87+
{% if page.publishingplatform == "aspnet-core" %}
88+
89+
{% tabs %}
90+
{% highlight cshtml tabtitle="CSHTML" %}
91+
{% include code-snippet/diagram/node/nodescollection/tagHelper %}
92+
{% endhighlight %}
93+
{% highlight c# tabtitle="Nodescollection.cs" %}
94+
{% include code-snippet/diagram/node/nodescollection/nodescollection.cs %}
95+
{% endhighlight %}
96+
{% endtabs %}
97+
98+
{% elsif page.publishingplatform == "aspnet-mvc" %}
99+
100+
{% tabs %}
101+
{% highlight c# tabtitle="Nodescollection.cs" %}
102+
{% include code-snippet/diagram/node/nodescollection/nodescollection.cs %}
103+
{% endhighlight %}
104+
{% endtabs %}
105+
{% endif %}
106+
83107
## Add node from palette
84108

85109
Nodes can be predefined and added to the palette, and can be dropped into the diagram when needed. For more information about adding nodes from symbol palette, refer to [`Symbol Palette`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Diagrams.SymbolPalette.html).

‎ej2-asp-core-mvc/diagram/ports.md

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -237,3 +237,36 @@ The offset property of port is used to align the port based on fractions. 0 repr
237237
## Constraints
238238

239239
The constraints property allows to enable/disable certain behaviors of ports. For more information about port constraints, refer to [`Port Constraints`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Diagrams.PortConstraints.html).
240+
241+
## Specify connection direction to port
242+
243+
The [connectionDirection] property of a port allows users to specify the direction in which a connector should establish a connection. This can be either to the port (incoming) or from the port (outgoing).
244+
245+
```javascript
246+
247+
248+
var port= [{
249+
id: 'port1',
250+
offset: {
251+
x: 0,
252+
y: 0.5
253+
},
254+
//specify the connectionDirection of the Port
255+
connectionDirection:'Right'
256+
} {
257+
id: 'port2',
258+
offset: {
259+
x: 1,
260+
y: 0.5
261+
},
262+
//specify the connectionDirection of the Port
263+
connectionDirection:'Left'
264+
},
265+
266+
];
267+
268+
269+
```
270+
271+
272+
![maxSegmentThumb](images\connectionDirection.png)

0 commit comments

Comments
 (0)