How to draw a flow graphic? urgently for the answer

[kawashima]

Hi,

I am using Syncfusion evaluation version, curently I am evaluating syncfusion diagram. I want to draw the flow graphic as the attachment file by diagram. I try many times to do, but I don't success to draw it. I want each Orthogonal line not across, and each label value for orthogonal line is not across with orthogonal line. So I am highly appreaciting if any one give some sample application and help me to draw it.

Thanks,

flow graphic0.zip

[J.Nagarajan]

Hi Kawashima,

Thanks for your interest in Syncfusion product. Our can allow you to draw Flow graphics as shown in your screen shot. You can create the symbol palette by using our Symbol Designer . It is located in the [installdir]\Program Files\Syncfusion\Essential Studio\Version\Diagram\Symbol Designer directory.

You can connect the symbols through the Orthogonal Links.

I have attached the sample for your reference. In this sample I have created this diagram and saved as a edd file. You can load this file in the Form Load event.

You can download this sample from the following page

http://websamples.syncfusion.com/samples/Diagram.Windows/F57501/main.htm

Please refer to the sample and let me know if you have any questions.

Thanks for using Syncfusion products.

Regards,
Nagaraj

[kawashima]

Thanks,
but I do not want to load the edd file. and I want to draw the flow graphic by write the code. How do I write the code of drawing the flow graphic which each Orthogonal line not across and each Orthogonal line width is set by each Orthogonal line label value.
So I am highly appreaciting if you give some sample application and help me to draw it by writing code.


Thanks for your reply.

Kawashima,

[J.Nagarajan]

Hi Kawashima,

If your intention is to programatically add the symbols then you have to customize the Symbol Base class

Here is a code sample demonstrating how this custom symbol (MySymbol) can be created.

public class MySymbol : Symbol
{
public MyRoundRect()
{
public MyRoundRect(string text)
{
Syncfusion.Windows.Forms.Diagram.RoundRect node = new Syncfusion.Windows.Forms.Diagram.RoundRect(0,0,300,100);
node.Width = 150;
node.Height = 70;
node.BorderStyle.ShowBorder = true;
this.AddLabel(text,BoxPosition.Center);
this.Nodes.Add(node);
this.AddLabel(text,BoxPosition.Center);
}
}
//In FormLoad Event

MyRoundRect rrect=new MyRoundRect("100");
rrect.X=50;
rrect.Y=100;
this.diagram1.Model.AppendChild(rrect);

//To Add Link

LinkCmd linkcommand = new LinkCmd();
Link link = new Link(Link.Shapes.OrthogonalLine);
link.LineStyle.LineWidth=3;

link.Labels.Add(new LinkLabel(link, "32757"));
link.Labels[0].BackgroundStyle.Color=Color.White;
linkcommand.Link = link;

// Set up the source and target ports for the link
linkcommand.SourcePort = rect.CenterPort;
linkcommand.TargetPort =rrect.bottomport;
link.EndPoints.FirstEndPointDecorator = new EndPointDecorator(EndPointVisuals.ClosedArrow);

// Execute the command to connect the two symbols
this.diagram1.Controller.ExecuteCommand(linkcommand);

I have attached the sample for your reference. Please refer to it and let me know if you have any questions.

Thanks for using Syncfusion product.

Regards,
Nagaraj

FlowGraphics.zip

[kawashima]

Thanks,
I find new question when use the syncfusion digram. I draw the flow graphic by write the code in diagram control. I find some flow graphic node don't display in right region of diagram control. The error graphic is in attachment file. How do I draw the right flow graphic with diagram control?
So I am highly appreaciting if you give some sample application and help me to rightly draw it by writing code.


Thanks for your reply.

Kawashima,

errorgraphic1.zip

[J.Nagarajan]

Hi Kawashima,

1. We regret for the inconvenience caused. I have tested this issue in v.4.4.0.51. I am afraid, I was not able to reproduce this issue. I have attached my test sample in following page

http://websamples.syncfusion.com/samples/Diagram.Windows/F57502/main.htm

Could you please check the sample and let me know whether you are able to reproduce the issue in this sample?. It would be helpful if you provide a sample or modify this sample to reproduce this issue. It will help us to resolve it as early as possible.

2. You can set the "model.LineRoutingEnabled" proerty to true to draw the Orthogonal lines in different line routing.

this.diagram1.Model.LineRoutingEnabled=true;

Please let me know if you have any questions.

Thanks for using Essential Diagram.

Regards,
J.Nagaraj

[kawashima]

Thanks,
I modify the sample of your provided. My modified code is the width of MyRectangle and MyRoundRect, the X coordinate of MyRectangle and MyRoundRect with the notation of "My code is as follow". The code is in the attachment file.
So I am highly appreaciting if you give some sample application and help me to rightly draw it by writing code.


Thanks for your reply.

Kawashima,

FlowGraphics_Modified0.zip

[J.Nagarajan]

Hi Kawashima,

Thanks for the modified sample. In your sample you are trying to position the image beyond the Model's size. Could you please Change the Model's width to 3000.

this.diagram.Model.Width=3000;

I have modified the sample. You can download this sample from the following page.

http://websamples.syncfusion.com/samples/Diagram.Windows/FlowGraphicsDiagram/main.htm

Please refer to it and let me know if you have any questions.

Thanks for using Syncfusion product.

Regards,
Nagaraj