Class Connector

Connectors are objects used to create link between two points, nodes or ports to represent the relationships between them.

Inheritance

System.Object

EJTagHelper

Connector

Inherited Members

EJTagHelper.GetControlDetails()

EJTagHelper.GetControlDetails(String)

System.Object.ToString()

System.Object.Equals(System.Object)

System.Object.Equals(System.Object, System.Object)

System.Object.ReferenceEquals(System.Object, System.Object)

System.Object.GetHashCode()

System.Object.GetType()

System.Object.MemberwiseClone()

Namespace: Syncfusion.JavaScript.DataVisualization.Models.Diagram

Assembly: Syncfusion.EJ.dll

Syntax

public class Connector : EJTagHelper

Constructors

Connector()

Initializes a new instance of the Connector class.

Declaration

public Connector()

Connector(Connector)

Initializes a new instance of the Connector class.

Declaration

public Connector(Connector src)

Parameters

Type	Name	Description
Connector	src

Properties

AddInfo

Gets or sets additional information about connectors

Declaration

[JsonProperty("addInfo")]
public object AddInfo { get; set; }

Property Value

Type	Description
System.Object	null

Examples

           Connector Connector = new Connector();
           Connector.Name = "connector1";

           Dictionary<string, object> AddInfo = new Dictionary<string, object>();
           AddInfo.Add("Description", "Bidirectional Flow");
           connector.AddInfo = AddInfo;

BridgeSpace

Gets or sets the width of the line bridges

Declaration

[JsonProperty("bridgeSpace")]
public double BridgeSpace { get; set; }

Property Value

Type	Description
System.Double	10

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector1 = new Connector()
           {
               Name = "connector1",
               SourcePoint = new DiagramPoint(100, 100),
               TargetPoint = new DiagramPoint(200, 200),
               BridgeSpace = 15
           };
           Model.Connectors.Add(Connector1);
           Connector Connector2 = new Connector()
           {
               Name = "connector2",
               SourcePoint = new DiagramPoint(150, 100),
               TargetPoint = new DiagramPoint(150, 200),
               BridgeSpace = 15
           };
           Model.Connectors.Add(Connector2);
           Model.Constraints = DiagramConstraints.Default | DiagramConstraints.Bridging;

Constraints

Gets or sets constraints of the connector

Declaration

[JsonConverter(typeof(StringEnumConverter))]
[JsonProperty("constraints")]
public ConnectorConstraints Constraints { get; set; }

Property Value

Type	Description
ConnectorConstraints	ConnectorConstraints.Default

Examples

           Connector Connector1 = new Connector()
           {
               Name = "connector1",
               SourcePoint = new DiagramPoint(100, 100),
               TargetPoint = new DiagramPoint(200, 200),
               Constraints = ConnectorConstraints.Bridging
           };
           Model.Connectors.Add(Connector1);

CornerRadius

Gets or sets the radius of the rounded corner

Declaration

[JsonProperty("cornerRadius")]
public double CornerRadius { get; set; }

Property Value

Type	Description
System.Double	0

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector1 = new Connector();
           Connector1.Name = "connector1";
           Connector1.SourcePoint = new DiagramPoint(100, 100);
           Connector1.TargetPoint = new DiagramPoint(200, 200);
           Connector1.CornerRadius = 15;
           Connector1.Segments.Add(new Segment() { Type = Segments.Orthogonal });
           Model.Connectors.Add(Connector1);

CssClass

Gets or sets the styles of shapes

Declaration

[JsonProperty("cssClass")]
public string CssClass { get; set; }

Property Value

Type	Description
System.String	String.Empty

Examples

   <style>
       .hoverConnector:hover {
           stroke:blue
       }
   </style>
           DiagramProperties Model = new DiagramProperties();
           Connector connector1 = new Connector();
           connector1.Name = "connector1";
           connector1.SourcePoint = new DiagramPoint(100, 100);
           connector1.TargetPoint = new DiagramPoint(200, 200);
           connector1.CssClass = "hoverConnector";
           Model.Connectors.Add(connector1);
           ViewData["diagramModel"] = Model;

Flip

Gets or sets the flip direction of connectors

Declaration

[JsonProperty("flip")]
[JsonConverter(typeof(StringEnumConverter))]
public FlipDirection Flip { get; set; }

Property Value

Type	Description
FlipDirection	black

Examples

           
DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";                                   
           Connector.Flip = FlipDirection.Horizontal;
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

HorizontalAlign

Gets or sets the horizontal alignment of the connector. Applicable, if the parent of the connector is a container

Declaration

[JsonConverter(typeof(StringEnumConverter))]
[JsonProperty("horizontalAlign")]
public HorizontalAlignment HorizontalAlign { get; set; }

Property Value

Type	Description
HorizontalAlignment	HorizontalAlignment.Left

Examples

           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.HorizontalAlign = HorizontalAlignment.Right;
           Model.Connectors.Add(Connector);

Labels

Gets or sets collection of label objects where each object represents a label

Declaration

[JsonProperty("labels")]
public Collection Labels { get; set; }

Property Value

Type	Description
Collection	Collection

Examples

           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.Labels.Add(new Label() { Text = "Connector" });

Line

Declaration

[Obsolete("Use Segments")]
public Line Line { get; set; }

Property Value

Type	Description
Line

LineColor

Gets or sets the stroke color of the connector

Declaration

[JsonProperty("lineColor")]
public string LineColor { get; set; }

Property Value

Type	Description
System.String	black

Examples

            DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.LineColor = "blue";
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

LineDashArray

Gets or sets the pattern of dashes and gaps used to stroke the path of the connector

Declaration

[JsonProperty("lineDashArray")]
public string LineDashArray { get; set; }

Property Value

Type	Description
System.String	String.Empty

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.LineDashArray = "2,2";
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

LineHitPadding

Gets or sets the padding value to ease the interaction with connectors

Declaration

[JsonProperty("lineHitPadding")]
public double LineHitPadding { get; set; }

Property Value

Type	Description
System.Double	10

Examples

           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.LineHitPadding = 15;
           Model.Connectors.Add(Connector);

LineWidth

Gets or sets the width of the line

Declaration

[JsonProperty("lineWidth")]
public double LineWidth { get; set; }

Property Value

Type	Description
System.Double	1

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.LineWidth = 10;
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

MaxHeight

Declaration

[JsonProperty("maxHeight")]
public double MaxHeight { get; set; }

Property Value

Type	Description
System.Double

MaxWidth

Gets or sets maximum width of the connector

Declaration

[JsonProperty("maxWidth")]
public double MaxWidth { get; set; }

Property Value

Type	Description
System.Double	0

Examples

        Connector Connector = new Connector()
           {
               Name = "connector1",
               SourcePoint = new DiagramPoint(100, 100),
               TargetPoint = new DiagramPoint(200, 200),
               MaxWidth = 100
           };

MinHeight

Gets or sets minimum height of the connector

Declaration

[JsonProperty("minHeight")]
public double MinHeight { get; set; }

Property Value

Type	Description
System.Double	0

Examples

        Connector Connector = new Connector()
           {
               Name = "connector1",
               SourcePoint = new DiagramPoint(100, 100),
               TargetPoint = new DiagramPoint(200, 200),
               MinHeight = 100
           };

MinWidth

Gets or sets minimum width of the connector

Declaration

[JsonProperty("minWidth")]
public double MinWidth { get; set; }

Property Value

Type	Description
System.Double	0

Examples

        Connector Connector = new Connector()
           {
               Name = "connector1",
               SourcePoint = new DiagramPoint(100, 100),
               TargetPoint = new DiagramPoint(200, 200),
               MinWidth = 100
           };

Name

Gets or sets Name of the connector

Declaration

[JsonProperty("name")]
public string Name { get; set; }

Property Value

Type	Description
System.String	String.Empty

Examples

           Connector connector1 = new Connector()
           {
               Name = "connector1", 
           };
           Model.Connectors.Add(connector1);

Opacity

Gets or sets the transparency of the connector

Declaration

[JsonProperty("opacity")]
public double Opacity { get; set; }

Property Value

Type	Description
System.Double	1

Examples

            Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.Opacity = 1;      
           Model.Connectors.Add(Connector);

PaletteItem

Gets or sets the size and preview size of the node to add that to symbol palette.

Declaration

[JsonProperty("paletteItem")]
public PaletteItem PaletteItem { get; set; }

Property Value

Type	Description
PaletteItem	null

Examples

           SymbolPaletteProperties SymbolPalette = new SymbolPaletteProperties();
           SymbolPalette.Palettes = new Collection();
           Palette Palette = new Palette("Connectors");
           palette.Expanded = true;
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.Segments.Add(new Segment() { Type = Segments.Bezier });
           Connector.PaletteItem.PreviewWidth = 100;
           Connector.PaletteItem.PreviewHeight = 100;
           Palette.Items.Add(Connector);
           ViewData["PaletteModel"] = SymbolPalette;

Parent

Gets or sets the parent name of the connector.

Declaration

[JsonProperty("parent")]
public string Parent { get; set; }

Property Value

Type	Description
System.String	String.Empty

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.MarginTop = 10;
           Connector.Parent = "";
           Group Group = new Group();
           Group.Name = "group";
           Group.Children.Add("Connector");  
           Group.FillColor = "gray";
           Model.Nodes.Add(Group);
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

Segments

Gets or sets collection of segment objects where each object represents a segment

Declaration

[JsonProperty("segments")]
public Collection Segments { get; set; }

Property Value

Type	Description
Collection	Segments.Straight

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight, Point = new DiagramPoint(75, 150) });
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

Shape

Declaration

[JsonProperty("shape")]
public object Shape { get; set; }

Property Value

Type	Description
System.Object

SourceDecorator

Gets or sets the source decorator of the connector

Declaration

[JsonProperty("sourceDecorator")]
public Decorator SourceDecorator { get; set; }

Property Value

Type	Description
Decorator	null

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Connector.SourceDecorator = new Decorator() { Shape = DecoratorShapes.OpenArrow };
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

SourceNode

Gets or sets the source node of the connector

Declaration

[JsonProperty("sourceNode")]
public string SourceNode { get; set; }

Property Value

Type	Description
System.String	String.Empty

Examples

           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Connector.SourceNode = "source";
           Connector.TargetNode = "target";

SourcePadding

Gets or sets the space to be left between the source node and the source point of a connector

Declaration

[JsonProperty("sourcePadding")]
public double SourcePadding { get; set; }

Property Value

Type	Description
System.Double	0

Examples

            Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Connector.SourcePadding = 2;

SourcePoint

Gets or sets the start point of the connector

Declaration

[JsonProperty("sourcePoint")]
public DiagramPoint SourcePoint { get; set; }

Property Value

Type	Description
DiagramPoint	DiagramPoint

Examples

           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Connector.SourcePoint = new DiagramPoint(100, 100);

SourcePort

Gets or sets the source port of the connector

Declaration

[JsonProperty("sourcePort")]
public string SourcePort { get; set; }

Property Value

Type	Description
System.String	String.Empty

Examples

            DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Connector.SourceNode = "source";
           Connector.SourcePort = "sourceport";
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

TargetDecorator

Gets or sets the target decorator of the connector

Declaration

[JsonProperty("targetDecorator")]
public Decorator TargetDecorator { get; set; }

Property Value

Type	Description
Decorator	new Decorator()

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Connector.TargetDecorator = new Decorator() { Shape = DecoratorShapes.OpenArrow };
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

TargetNode

Gets or sets the target node of the connector

Declaration

[JsonProperty("targetNode")]
public string TargetNode { get; set; }

Property Value

Type	Description
System.String	String.Empty

Examples

           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200); 
           Connector.TargetNode = "TargetNode";

TargetPadding

Gets or the space to be left between the target node and the target point of the connector

Declaration

[JsonProperty("targetPadding")]
public double TargetPadding { get; set; }

Property Value

Type	Description
System.Double	0

Examples

           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Connector.TargetDecorator = new Decorator() { Shape = DecoratorShapes.Circle };
           Connector.TargetPadding = 2;

TargetPoint

Gets or sets the end point of the connector

Declaration

[JsonProperty("targetPoint")]
public DiagramPoint TargetPoint { get; set; }

Property Value

Type	Description
DiagramPoint	DiagramPoint

Examples

           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Connector.TargetDecorator = new Decorator() { Shape = DecoratorShapes.Circle };
           Connector.TargetPoint = new DiagramPoint(200, 200);

TargetPort

Gets or sets the targetPort of the connector

Declaration

[JsonProperty("targetPort")]
public string TargetPort { get; set; }

Property Value

Type	Description
System.String	String.Empty

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Connector.TargetDecorator = new Decorator() { Shape = DecoratorShapes.Circle };
           Connector.TargetPort = "targetport";
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

Tooltip

Gets or sets the tooltip that should be shown when the mouse hovers over connector

Declaration

[JsonProperty("tooltip")]
public Tooltip Tooltip { get; set; }

Property Value

Type	Description
Tooltip	null

Examples

   <script type="text/x-jsrender" id="mouseovertooltip">
   <div style="background-color: #F08080; color: white; white-space: nowrap; height: 20px">
       <span style="padding: 5px;"> {{:name}} </span>
   </div>
   </script>
          DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Top;
           Connector.Segments.Add(new Segment() { Type = Segments.Straight });
           Tooltip Tooltip = new Tooltip();
           Tooltip.TemplateId = "mouseovertooltip";
           Tooltip.Alignment.Horizontal = HorizontalAlignment.Center;
           Tooltip.Alignment.Vertical = VerticalAlignment.Bottom;
           Connector.Constraints = ConnectorConstraints.InheritTooltip;
           Connector.Tooltip = tooltip;
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

Type

Gets or sets the connector type as connector

Declaration

[JsonProperty("type")]
public string Type { get; set; }

Property Value

Type	Description
System.String	"connector"

Examples

           Connector Connector = new Connector()
           {
               Name = "connector1",
               Type = "connector"
           };
           Model.Connectors.Add(Connector);

VerticalAlign

Gets or sets the vertical alignment of connector (Applicable,if the parent is group)

Declaration

[JsonProperty("verticalAlign")]
[JsonConverter(typeof(StringEnumConverter))]
public VerticalAlignment VerticalAlign { get; set; }

Property Value

Type	Description
VerticalAlignment	VerticalAlignment.Top

Examples

           DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.VerticalAlign = VerticalAlignment.Bottom;
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;
           return View();

Visible

Enables or disables the visibility of connector

Declaration

[JsonProperty("visible")]
public bool Visible { get; set; }

Property Value

Type	Description
System.Boolean	true

Examples

            DiagramProperties Model = new DiagramProperties();
           Connector Connector = new Connector();
           Connector.Name = "connector1";
           Connector.SourcePoint = new DiagramPoint(100, 100);
           Connector.TargetPoint = new DiagramPoint(200, 200);
           Connector.Visible = false;
           Model.Connectors.Add(Connector);
           ViewData["diagramModel"] = Model;

ZOrder

Gets or sets the Z index of the connector

Declaration

[JsonProperty("zOrder")]
public double ZOrder { get; set; }

Property Value

Type	Description
System.Double	-1

Examples

           Connector Connector = new Connector()
           {
               Name = "connector1",
               ZOrder = 3
           };
           Model.Connectors.Add(Connector);

Methods

Clone()

Performs a deep copy of the set of matched elements, meaning that it copies the matched elements as well as all of their descendant elements.

Declaration

public object Clone()

Returns

Type	Description
System.Object	object

Examples

           Connector Connector = new Connector() { Name = "connector" };
           Connector ConnectorClone = (Connector)Connector.Clone();