We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

How to add line segments

Thread ID:

Created:

Updated:

Platform:

Replies:

116405 May 20,2014 05:23 AM May 20,2014 08:24 AM WinRT 1
loading
Tags: SfDiagram
madhu
Asked On May 20, 2014 05:23 AM

Hi,

    There are no line segments API found in syncfusion although its mentioned in the documentation.

How do I add line segment in the below code?

http://www.syncfusion.com/downloads/support/forum/116037/DiagramBuilder_1162136a_8febf526_1d05cbd2.zip


Parthiban A [Syncfusion]
Replied On May 20, 2014 08:24 AM

Hi Madhu,

Thanks for using Syncfusion Product.

In the online documentation we have shown only how to use SfDiagram API not about diagram builder.

Diagram builder sample is just a demo sample(showcase) to show, how SfDiagram product can be used in some specific scenarios like diagram builder application. In diagram builder we have exposed very limited set of SfDiagram features.

First let us see how to add a connector with segments in sfDiagram and then we can see how to do the same in DiagramBuilder.

SfDiagram API:

  • To create connector

ConnectorViewModel con = new ConnectorViewModel()

{

     SourcePoint = new Point(100, 200),

     TargetPoint = new Point(200, 200),    

     // Customizing the ConnectorGeometryStyle.

     ConnectorGeometryStyle = this.Resources["connectorstyle"as Style

};

 

  • To add segments to the connector

//Adding Line Segment to Segments.

con.Segments = new ObservableCollection<IConnectorSegment>()

{

      new LineSegment() { Point = new Point(150,100) }

};

 

  • To add Connector to Diagram control

ObservableCollection<ConnectorViewModel> lines = new ObservableCollection<ConnectorViewModel>();

ConnectorViewModel con = new ConnectorViewModel()

{

SourceNode = source,

TargetNode = target,

ConnectorGeometryStyle = GetConStyle()

};

// Adding Connection to SfDiagram

SfDiagram daigramcontrol=new SfDiagram();

lines.Add(con);

diagramcontrol.Connectors = lines;

 

Diagram Builder API:

DiagramBuilder is created based on MVVM pattern, so we have created a custom set of view models (DiagramVM,ConnectorVM, NodeVM, etc,.) for necessary interfaces. Here, ConnectorVM is derived from IConnector, it has all the properties like SourcePoint, TargetPoint, etc like in ConnectorViewModel. So you can add ConnectorVM to diagram builder similar to ConnectorViewModel.

 

  • To create connector

ConnectorVM con = new ConnectorVM()

{

     SourcePoint = new Point(100, 200),

     TargetPoint = new Point(200, 200),    

     // Customizing the ConnectorGeometryStyle.

     ConnectorGeometryStyle = this.Resources["connectorstyle"as Style

};

  • To add segments to the connector

//Adding Line Segment to Segments.

con.Segments = new ObservableCollection<IConnectorSegment>()

{

      new LineSegment() { Point = new Point(150,100) }

};

 

  • To add Connector to Diagram control, , add below code in DiagramVM.cs class

ConnectorVM con = new ConnectorVM()

{

SourceNode = source,

TargetNode = target,

ConnectorGeometryStyle = GetConStyle()

};

// Adding Connection to DiagramVM.

DiagramVM diagram=new DiagramVM();

(Diagram.Connectors as ObservableCollection<ConnectorViewModel>).Add(con);

Instead of using sfDiagram, DiagramVM is used in DiagramBuilder. Which is derived from DiagramViewModel. So that you can directly add ConnectorVM to DiagramVM.Connector collection. You can find DiagramVM class in folder  DiagramBuilder/ViewModel/DiagramVM.cs.

Corresponding API’s in Diagram Builder:

  1. ConnectorViewModel – ConnectorVM(deriving from IConnector)

  2. SfDiagram                   - DiagramVM(deriving from DaigramViewModel).

 

Regards,

Parthiban


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;