Hierarchical Tree - CodeProject

Introduction

This is an extension to the wonderful and simple tree generator that Rotem Sapir wrote. (TreeGenerator.aspx)

Using the Code

The code base is developed on top of the code that Rotem Sapir had developed. However, there have been updates to the way the node is rendered. This one gives a professional touch with a subtle shadow effect to each of the node.

This also has a provision of specifying the background color to each of the nodes. You could have your own logic of coloring the nodes, either by levels in the organization tree or based on any other geographic or data specific colors (for example, if you are rendering a hierarchy chart to show the % of sales, # of people working under a person etc., etc.,)

This code now supports a selection color for the node, ie., when the user selects a node in the tree the selected color of the node can now be changed by setting the _SelectedBoxFillColor

Here is the sample client code that uses the TreeGenerator:

  public partial class MainForm : Form
  {
    private Color[] hierarchyNodeColor = { Color.FromArgb(26, 80, 160),
        Color.FromArgb(35, 107, 215), Color.FromArgb(100, 152, 230),
        Color.FromArgb(169, 198, 241), Color.FromArgb(178, 207, 250) };
    private TreeBuilder myTree = null;

    public MainForm()
    {
      InitializeComponent();
      InitializeHierarchyTree();
    }

    public void InitializeHierarchyTree()
    {
      picHierarchyTree.Location = containerPanel.Location;
      picHierarchyTree.Dock = DockStyle.Left;
      picHierarchyTree.SizeMode = PictureBoxSizeMode.AutoSize;
      containerPanel.AutoScroll = true;

      LoadHierarchyControl();
    }

    public void LoadHierarchyControl()
    {
      myTree = new TreeBuilder(GetTreeData());
      PaintHierarchyTree();
    }

    private void PaintHierarchyTree()
    {
      picHierarchyTree.Image = Image.FromStream(myTree.GenerateTree(-1, -1, "1",
        System.Drawing.Imaging.ImageFormat.Bmp));
    }
    private TreeData.TreeDataTableDataTable GetTreeData()
    {
      TreeData.TreeDataTableDataTable dt = new TreeData.TreeDataTableDataTable();
      dt.AddTreeDataTableRow("1", "", "Localhost", "This is your Local Server",
          hierarchyNodeColor[0].ToArgb());
      dt.AddTreeDataTableRow("2", "1", "Child 1", "This is the first child.",
          hierarchyNodeColor[1].ToArgb());
      dt.AddTreeDataTableRow("3", "1", "Child 2", "This is the second child.",
          hierarchyNodeColor[2].ToArgb());
      dt.AddTreeDataTableRow("4", "1", "Child 3", "This is the third child.",
          hierarchyNodeColor[3].ToArgb());
      dt.AddTreeDataTableRow("5", "2", "GrandChild 1", "This is the only Grandchild.",
          hierarchyNodeColor[4].ToArgb());
      for (int i = 6; i < 10; i++)
      {
        Random rand = new Random();
        dt.AddTreeDataTableRow(i.ToString(), rand.Next(1, i).ToString(),
            "GrandChild " + i.ToString(), "This is the only Grandchild.",
            hierarchyNodeColor[4].ToArgb());
      }
      return dt;
    }
    private void picHierarchyTree_MouseClick(object sender, MouseEventArgs e)
    {
      // returns the XML node
      XmlNode selectedNode = myTree.OnClick(e.X, e.Y);
      PaintHierarchyTree();
    }

  }
}

Points of Interest

Though the original code base was nice, there were few redundant files and bringing in a shadow effect brought a lot of professional look to the whole code, in addition to removing unncessary code files that were not in use.