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.

Automatic Layout - Diagram Builder

Thread ID:

Created:

Updated:

Platform:

Replies:

116151 Apr 14,2014 10:05 AM Apr 17,2014 07:03 AM WinRT 3
loading
Tags: SfDiagram
Sandeep Kandula
Asked On April 14, 2014 10:05 AM

Scenario 1)
Till now, I use to drag and drop symbols present in Stencil to SfDiagram control.
I could not find documentation\API for following requirements :
Is it possible to export the configured diagram in form of XAML\XML?
After the export XAML\XML is done, can I import it back to SfDiagram Control?
 
Scenario 2)
In WINRT documentation (Diagram -> Automatic Layout - Directed Tree Layout), it is mentioned that I can programmatically Add Nodes and AddConnector. But I would like to use Symbols present in Stencil instead of default node. Is it technically possible?
 
If Scenario 1 is supported then I can create my own XML and add symbols programmatically based on user requirement. Then this XML can be imported by user to see diagram automatically.
 

Parthiban A [Syncfusion]
Replied On April 15, 2014 09:09 AM

Hi Sandeep,

We have analysed your query kindly find the details below.

S.No

Queries

Resoponses

1.

Is it possible to export the configured diagram in form of XAML\XML?

After the export XAML\XML is done, can I import it back to SfDiagram Control?

In diagram control we have provided serialization support by DataContractSerializer. So while serializing, we only serialize the objects, which represents some of the states of the node, connectors. Then we can export as xml file, which in turn can be import to diagram control to load nodes and connectors automatically.

Diagram can only load, serialized xml file which is created already. It doesn’t support any custom xml file. In such case you have to create nodes and connector from your xml object and then load to diagram control.

2.

In WINRT documentation (Diagram -> Automatic Layout - Directed Tree Layout), it is mentioned that I can programmatically Add Nodes and AddConnector. But I would like to use Symbols present in Stencil instead of default node. Is it technically possible?

You can add nodes and connectors to diagram control manually. As per current behaviour while drag and drop symbol from stencil, we are cloning the symbol’s content and symbol template to dropped node. As like stencil symbol, you can create node on code behind with content and content template.

Code Snippet:

NodeViewModel node = new NodeViewModel();

       node.OffsetX = 100;

       node.OffsetY = 100;

       node.UnitWidth = 100;

       node.UnitHeight = 100;

       node.Content ="M158.5,95.1283269797681L26.5,105.628322653968 121,219.628166664837 29.5,339.62822625042 160,342.628225014478 236.915602847904,446.724181328487 316,341.128225632449 461.5,344.128224396506 361,213.628172103343 460,113.128319564111 317.5,92.1283282157111 242.5,-0.871633462889512z";

       node.ContentTemplate = this.Resources["pathDataTemplate"] as DataTemplate;

       (diagram.Nodes as DiagramCollection).Add(node);

 

//Templates and Styles

<Style x:Name="SymbolStyle" TargetType="Path">

              <Setter Property="Fill" Value="#FFFFFF"/>

              <Setter Property="Stroke" Value="#FF7F7F7F"/>

              <Setter Property="StrokeThickness" Value="1"/>

              <Setter Property="Stretch" Value="Fill"/>

        </Style>

 

        <DataTemplate x:Key="pathDataTemplate">

            <Path Data="{Binding}" Stretch="Fill" Style="{StaticResource SymbolStyle}"/>

        </DataTemplate>

Regards,

Parthiban


Sandeep Kandula
Replied On April 16, 2014 04:25 AM

Hi Sandeep,

We have analysed your query kindly find the details below.

S.No

Queries

Resoponses

1.

Is it possible to export the configured diagram in form of XAML\XML?

After the export XAML\XML is done, can I import it back to SfDiagram Control?

In diagram control we have provided serialization support by DataContractSerializer. So while serializing, we only serialize the objects, which represents some of the states of the node, connectors. Then we can export as xml file, which in turn can be import to diagram control to load nodes and connectors automatically.

Diagram can only load, serialized xml file which is created already. It doesn’t support any custom xml file. In such case you have to create nodes and connector from your xml object and then load to diagram control.

2.

In WINRT documentation (Diagram -> Automatic Layout - Directed Tree Layout), it is mentioned that I can programmatically Add Nodes and AddConnector. But I would like to use Symbols present in Stencil instead of default node. Is it technically possible?

You can add nodes and connectors to diagram control manually. As per current behaviour while drag and drop symbol from stencil, we are cloning the symbol’s content and symbol template to dropped node. As like stencil symbol, you can create node on code behind with content and content template.

Code Snippet:

NodeViewModel node = new NodeViewModel();

       node.OffsetX = 100;

       node.OffsetY = 100;

       node.UnitWidth = 100;

       node.UnitHeight = 100;

       node.Content ="M158.5,95.1283269797681L26.5,105.628322653968 121,219.628166664837 29.5,339.62822625042 160,342.628225014478 236.915602847904,446.724181328487 316,341.128225632449 461.5,344.128224396506 361,213.628172103343 460,113.128319564111 317.5,92.1283282157111 242.5,-0.871633462889512z";

       node.ContentTemplate = this.Resources["pathDataTemplate"] as DataTemplate;

       (diagram.Nodes as DiagramCollection).Add(node);

 

//Templates and Styles

<Style x:Name="SymbolStyle" TargetType="Path">

              <Setter Property="Fill" Value="#FFFFFF"/>

              <Setter Property="Stroke" Value="#FF7F7F7F"/>

              <Setter Property="StrokeThickness" Value="1"/>

              <Setter Property="Stretch" Value="Fill"/>

        </Style>

 

        <DataTemplate x:Key="pathDataTemplate">

            <Path Data="{Binding}" Stretch="Fill" Style="{StaticResource SymbolStyle}"/>

        </DataTemplate>

Regards,

Parthiban


Thanks for the inputs.
My requirement is that I will have a wizard with following inputs :
a) Symbol names (lets say Workstation, Server) present in Stencil View will be displayed in a TextBlock.
b)Number of quantities required for each symbol name (lets say Workstation, Server) will be display in TextBox.
 
Based on user inputs, I need to draw the diagram dynamically using Syncfusion Diagram control.
 
Diagram can only load, serialized xml file which is created already. It doesn’t support any custom xml file. In such case you have to create nodes and connector from your xml object and then load to diagram control.
Can I get any sample code for this or any help link?
 
Please check my code (attach file) for serialization and Deserialization written based on below mentioned links. Serialization is fine but Deserialization throws an exception. sfDiagram.Save generates an XML successfully but sfDriagram.Load fails.
 

Attachment: Step1_185e22bf.zip

Sudhakar C [Syncfusion]
Replied On April 17, 2014 07:03 AM

Hi Sandeep,

Please find the response for your queries in below.

Query

Response

a) Symbol names (lets say Workstation, Server) present in Stencil View will be displayed in a TextBlock.

b)Number of quantities required for each symbol name (lets say Workstation, Server) will be display in TextBox.

We can create the custom symbols in Stencil. We have a sample “Floor Planner” in dashboard to create the custom symbols.

 

For more information, please refer the sample in the below location.

 

Location : DashboardàWinRTàFloor Planner (which is located in showcase)

Diagram can only load, serialized xml file which is created already. It doesn’t support any custom xml file. In such case you have to create nodes and connector from your xml object and then load to diagram control.

Can I get any sample code for this or any help link?

 

Please check my code (attach file) for serialization and Deserialization written based on below mentioned links. Serialization is fine but Deserialization throws an exception. sfDiagram.Save generates an XML successfully but sfDriagram.Load fails.

http://help.syncfusion.com/UG/winrt/Documents/gettingstarted15.htm

http://help.syncfusion.com/UG/winrt/Documents/serialization.htm

 

1.Code for Save/Load the Diagram

 

   After analysing the provided sample,the Stream created for Writing purpose is used for Reading the Xml file.

This causes the reported problem.

We have modified the given sample to meet your requirement.

 

2.Collections of Diagram(named as "LoadDiagram") are not assigned,

it throws the exception while loading the Diagram from xml/Xaml.

 

3.In sample.Node has ContentTemplate

-ContentTemplate of the Node does not get serialized.ContentTemplate of Node can be appllied in NodeColectionsChanged Event

after Loading the Diagram.

 

For more information , please refer the modified sample.

 

Please let us know if you have any concerns on this.

Regards,

Sudhakar C 


Attachment: Step1_185e22bf_15f6282.zip

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.

;