Class Decorator
A connector's start and end points can be decorated with some customizable shapes like arrows, circles, diamond, or path.
Inherited Members
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 Decorator : EJTagHelper
Constructors
Decorator()
Declaration
public Decorator()
Decorator(Decorator)
Declaration
public Decorator(Decorator src)
Parameters
Type | Name | Description |
---|---|---|
Decorator | src |
Properties
BorderColor
Gets or sets border color of the decorator
Declaration
[JsonProperty("borderColor")]
public string BorderColor { get; set; }
Property Value
Type | Description |
---|---|
System.String | "black" |
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.SourceDecorator = new Decorator() { BorderColor = "red" };
Model.Connectors.Add(Connector);
BorderWidth
Gets or sets the border width of the decorator
Declaration
[JsonProperty("borderWidth")]
public double BorderWidth { 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.VerticalAlign = VerticalAlignment.Top;
Connector.Segments.Add(new Segment() { Type = Segments.Straight });
Connector.SourceDecorator = new Decorator() { BorderWidth = 5 };
Model.Connectors.Add(Connector);
CssClass
Gets or sets the style properties of the decorator
Declaration
[JsonProperty("cssClass")]
public string CssClass { 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.SourceDecorator = new Decorator() { CssClass = "classname", Shape = DecoratorShapes.Path, PathData = "M 376.892,225.284L 371.279,211.95L 376.892,198.617L 350.225,211.95L 376.892,225.284 Z" };
Model.Connectors.Add(Connector);
FillColor
Gets or sets the fill color of the decorator
Declaration
[JsonProperty("fillColor")]
public string FillColor { get; set; }
Property Value
Type | Description |
---|---|
System.String | "black" |
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.SourceDecorator = new Decorator() { FillColor = "red" };
Model.Connectors.Add(Connector);
Height
Gets or sets the height of the the decorator
Declaration
[JsonProperty("height")]
public double Height { get; set; }
Property Value
Type | Description |
---|---|
System.Double | 8 |
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.SourceDecorator = new Decorator() { Height = 10 };
Model.Connectors.Add(Connector);
PathData
Gets or sets the custom shape of the source decorator
Declaration
[JsonProperty("pathData")]
public string PathData { 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.SourceDecorator = new Decorator() { Shape = DecoratorShapes.Path, PathData = "M 376.892,225.284L 371.279,211.95L 376.892,198.617L 350.225,211.95L 376.892,225.284 Z" };
Shape
Gets or sets the decorator of the connector
Declaration
[JsonConverter(typeof(StringEnumConverter))]
[JsonProperty("shape")]
public DecoratorShapes Shape { get; set; }
Property Value
Type | Description |
---|---|
DecoratorShapes | null |
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.SourceDecorator = new Decorator() { Shape = DecoratorShapes.OpenArrow };
Model.Connectors.Add(Connector);
Width
Gets or sets the decorator width
Declaration
[JsonProperty("width")]
public double Width { get; set; }
Property Value
Type | Description |
---|---|
System.Double | 8 |
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.SourceDecorator = new Decorator() { Height = 10, Width = 10 };
Model.Connectors.Add(Connector);