Silverlight Organization Chart - Part 4 - Drawing

I have received too many messages to post the code for drawing the lines and the boxes for the Organization Chart, which actually the easy part after calculating the positions, but here it is:

Drawing Lines:

here in this method it is simply drawing a line

public void DrawLine(Canvas canvas, double x1, double y1, double x2, double y2)

{

Line line = new Line();

line.X1 = x1;

line.Y1 = y1;

line.X2 = x2;

line.Y2 = y2;

line.Stroke = Util.GetColorFromHex("#FF6495ed");

line.StrokeThickness = LinesStrokeThickness;

canvas.Children.Add(line);

}

Where LinesStrokeThickness = 1 And GetColorFromHex is a method that convert the RGB color to brush color:

public static SolidColorBrush GetColorFromHex(string myColor)

{

return new SolidColorBrush(

Color.FromArgb(

Convert.ToByte(myColor.Substring(1, 2), 16),

Convert.ToByte(myColor.Substring(3, 2), 16),

Convert.ToByte(myColor.Substring(5, 2), 16),

Convert.ToByte(myColor.Substring(7, 2), 16)

)

);

}

Drawing the box with the lines:

In this method it is drawing the NodeBox and set its values, also it put it in the right place based on the calculations.

public void AddBox(Canvas canvas, double x, double y, double? parentX, string ID, string name, string title, string department, string extension, bool root, bool subNodes)

{

NodeBox nb = new NodeBox(drawingScale);

nb.Name = ID;

nb.EmployeeName = name;

nb.Title = title;

nb.Department = department;

nb.Extension = extension;

nb.Width = buttonWidth;

nb.Height = buttonHeight;

nb.SetValue(Canvas.LeftProperty, x - nb.Width / 2);

nb.SetValue(Canvas.TopProperty, y);

canvas.Children.Add(nb);

// The line above the box

if (root)

DrawLine(canvas, x, y - minVerticalSpace, x, y);

// Draw the horizontal line to the parent

if (parentX != null)

DrawLine(canvas, x, y - minVerticalSpace, Convert.ToDouble(parentX), y - minVerticalSpace);

// Draw the line under the box

if (subNodes)

DrawLine(canvas, x, y + buttonHeight, x, y + buttonHeight + minVerticalSpace);

}

in-shaa Allah, this post help you to complete your organization chart based on Silverlight.