Class Side

Specifies where the user handles have to be aligned.

Inheritance

System.Object

Side

Namespace: Syncfusion.Blazor.Diagrams

Assembly: Syncfusion.Blazor.dll

Syntax

public sealed class Side : Enum

Remarks

To know more about using the side, refer to this link

1. UserHandles

To apply the user handle side, use the below code.

Examples

<SfDiagram Height="600px" Nodes="@NodeCollection" SelectedItems="@SelectedModel">
</SfDiagram>
@code{
   /// Defines diagram's nodes collection
   public ObservableCollection<DiagramNode> NodeCollection { get; set; }
   /// Defines diagram's SelectedItems
   public Syncfusion.Blazor.Diagrams.DiagramSelectedItems SelectedModel { get; set; }
   ObservableCollection<DiagramUserHandle> UserHandles { get; set; }
   protected override void OnInitialized()
   {
       ///Creating the userhandle for cloning the objects
       DiagramUserHandle CloneHandle = new DiagramUserHandle()
       {
           ///Name of the user handle
           Name = "clone",
           ///Set pathdata for userhandle
           PathData = "M60.3,18H27.5c-3,0-5.5,2.4-5.5,5.5v38.2h5.5V23.5h32.7V18z M68.5,28.9h-30c-3,0-5.5,2.4-5.5,5.5v38.2c0,3,2.4,5.5,5.5,5.5h30c3,0,5.5-2.4,5.5-5.5V34.4C73.9,31.4,71.5,28.9,68.5,28.9z M68.5,72.5h-30V34.4h30V72.5z",
           ///Set visibility for the user handle
           Visible = true,
           ///Set the position for the user handle
           Offset = 0,
           ///Set side based on the given offset
           Side = Side.Bottom,
           ///set margin for the user handle
           Margin = new DiagramUserHandleMargin() { Top = 0, Bottom = 0, Left = 0, Right = 0 }
       };
       ///Add user handle to the collection...
       UserHandles = new ObservableCollection<DiagramUserHandle>()
       {
           CloneHandle
       };
       SelectedModel = new Syncfusion.Blazor.Diagrams.DiagramSelectedItems()
       {
           ///Enable userhandle for selected items...
           Constraints = SelectorConstraints.UserHandle,
           UserHandles = this.UserHandles
       };
       NodeCollection = new ObservableCollection<DiagramNode>();
       DiagramNode DiagramNode = new DiagramNode()
       {
           Id = "node1",
           OffsetX = 100,
           OffsetY = 100,
           Width = 100,
           Height = 100,
           Style = new NodeShapeStyle() { Fill = "#659be5", StrokeColor = "none" },
           Annotations = new ObservableCollection<DiagramNodeAnnotation>() { new DiagramNodeAnnotation() { Content = "Node" } }
       };
       NodeCollection.Add(DiagramNode);
   }
}

Fields

Bottom

Aligns the user handles at the bottom of an object.

Declaration

public const Side Bottom

Field Value

Type	Description
Side

Left

Aligns the user handles at the left of an object.

Declaration

public const Side Left

Field Value

Type	Description
Side

Right

Aligns the user handles at the right of an object.

Declaration

public const Side Right

Field Value

Type	Description
Side

Top

Aligns the user handles at the top of an object.

Declaration

public const Side Top

Field Value

Type	Description
Side

value__

Declaration

public int value__

Field Value

Type	Description
System.Int32